@pine-ds/core 3.8.2 → 3.10.0

package/dist/pine-core/p-d2b15290.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsFilterCss","PdsFilter","exports","class_1","hostRef","_this","this","scrollRAF","lastScrollTime","variant","isOpen","handleNativePopoverToggle","event","target","id","concat","componentId","isCurrentlyOpen","matches","error","style","display","setTimeout","adjustPopoverPosition","pdsFilterOpen","emit","text","pdsFilterClose","handleKeyDown","key","preventDefault","handleClick","pdsFilterClear","closeOtherPopovers","supportsPopoverAPI","HTMLElement","prototype","showPopover","navigator","userAgent","includes","popoverEl","classList","add","remove","disconnectedCallback","cancelAnimationFrame","removeEventListener","hidePopover","componentDidRender","addEventListener","handleWindowResize","handleWindowScroll","supportsAnchorPositioning","document","documentElement","now","performance","throttleMs","requestAnimationFrame","el","isConnected","allFilters","querySelectorAll","forEach","filter","popover","_a","shadowRoot","querySelector","isPopoverOpen","triggerEl","triggerRect","getBoundingClientRect","viewportWidth","window","innerWidth","viewportHeight","innerHeight","popoverWidth","popoverHeight","height","bufferSpace","wouldOverflowRight","left","wouldOverflowBottom","bottom","top","transformOrigin","actualPopoverWidth","width","right","replace","cssText","showFilter","console","warn","hideFilter","handlePopoverToggle","handleDocumentClick","contains","popoverIsClosed","handleEscapeKey","getIcon","trash","icon","getTriggerClasses","classes","push","join","renderIcon","iconToRender","h","size","part","renderDropdownIcon","enlarge","class","render","Host","type","popoverTarget","undefined","popoverTargetAction","onKeyDown","onClick","ref"],"sources":["src/components/pds-filters/pds-filter/pds-filter.scss?tag=pds-filter&encapsulation=shadow","src/components/pds-filters/pds-filter/pds-filter.tsx"],"sourcesContent":[":host {\n  --box-shadow-focus: 0 0 0 1px var(--pine-color-white), 0 0 0 3px var(--pine-color-focus-ring);\n\n  display: inline-block;\n  position: relative;\n}\n\n.pds-filter__trigger {\n  align-items: center;\n  /* stylelint-disable-next-line property-no-unknown */\n  anchor-name: --filter-trigger;\n  background: var(--pine-color-background-container);\n  border: var(--pine-border-width-thin) solid var(--pine-color-border);\n  border-radius: var(--pine-dimension-100);\n  box-shadow: var(--pine-box-shadow-050);\n  box-sizing: border-box;\n  color: var(--pine-color-text-placeholder);\n  cursor: pointer;\n  display: inline-flex;\n  font-family: var(--pine-font-family-inter);\n  font-size: var(--pine-font-size-100);\n  font-weight: var(--pine-font-weight-400);\n  gap: var(--pine-dimension-050);\n  letter-spacing: var(--pine-letter-spacing-114);\n  line-height: var(--pine-line-height-150);\n  padding: var(--pine-dimension-025) var(--pine-dimension-125);\n  position: relative;\n  transition: all 0.2s ease;\n\n  pds-icon {\n    block-size: var(--pine-font-size-100);\n    color: var(--pine-color-grey-800);\n    flex-shrink: 0;\n    inline-size: var(--pine-font-size-100);\n  }\n\n  &:hover,\n  &.pds-filter__trigger--open {\n    background-color: var(--pine-color-grey-100);\n    border-color: var(--pine-color-grey-400);\n    color: var(--pine-color-text-hover);\n\n    pds-icon {\n      color: var(--pine-color-grey-800);\n    }\n  }\n\n  &:focus-visible {\n    box-shadow: var(--box-shadow-focus);\n    outline: none;\n  }\n\n  &:disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n  }\n}\n\n.pds-filter__trigger--selected {\n  background-color: var(--pine-color-purple-050);\n  border-color: var(--pine-color-purple-500);\n  color: var(--pine-color-purple-600);\n\n  pds-icon {\n    color: var(--pine-color-purple-600);\n  }\n\n  &:hover,\n  &.pds-filter__trigger--open {\n    background-color: var(--pine-color-purple-100);\n    border-color: var(--pine-color-purple-500);\n    color: var(--pine-color-purple-600);\n\n    pds-icon {\n      color: var(--pine-color-purple-600);\n    }\n  }\n\n  &:focus-visible {\n    box-shadow: var(--box-shadow-focus);\n    outline: none;\n  }\n}\n\n.pds-filter__trigger--more {\n  background-color: var(--pine-color-grey-050);\n  border: var(--pine-border-width-thin) dashed var(--pine-color-grey-300);\n  color: var(--pine-color-text-placeholder);\n\n  pds-icon {\n    color: var(--pine-color-grey-800);\n  }\n\n  &:hover,\n  &.pds-filter__trigger--open {\n    background-color: var(--pine-color-grey-100);\n    border-color: var(--pine-color-grey-400);\n    color: var(--pine-color-text-hover);\n\n    pds-icon {\n      color: var(--pine-color-grey-800);\n    }\n  }\n\n  &:focus-visible {\n    box-shadow: var(--box-shadow-focus);\n    outline: none;\n  }\n}\n\n.pds-filter__trigger--clear {\n  background: transparent;\n  border: var(--pine-border-width-thin) solid transparent;\n  border-radius: var(--pine-dimension-100);\n  box-shadow: none;\n  color: var(--pine-color-purple-600);\n\n  pds-icon {\n    color: var(--pine-color-purple-600);\n  }\n\n  &:hover {\n    background-color: var(--pine-color-purple-100);\n    border-color: var(--pine-color-purple-100);\n    color: var(--pine-color-purple-600);\n\n    pds-icon {\n      color: var(--pine-color-purple-600);\n    }\n  }\n\n  &:focus-visible {\n    box-shadow: var(--box-shadow-focus);\n    outline: none;\n  }\n}\n\n.pds-filter__button-content {\n  align-items: center;\n  display: inline-flex;\n  gap: var(--pine-dimension-050);\n  max-inline-size: 148px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.pds-filter__button-text {\n  line-height: var(--pine-line-height-150);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.pds-filter__dropdown-icon {\n  block-size: var(--pine-dimension-200);\n  flex-shrink: 0;\n  inline-size: var(--pine-dimension-200);\n}\n\n\n.pds-filter__popover {\n  background-color: var(--pine-color-background-container);\n  border: 0;\n  border-radius: var(--pine-dimension-100);\n  box-shadow: var(--pine-box-shadow-100);\n  display: none;\n  inline-size: 228px;\n  inset: unset;\n  padding: var(--pine-dimension-100);\n  z-index: var(--pine-z-index-overlay);\n\n  /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n  &:popover-open,\n  &.is-open {\n    display: block;\n  }\n\n  /* Modern browsers: CSS anchor positioning with JavaScript-controlled flipping */\n  @supports (anchor-name: --test) {\n    inset-block-start: calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));\n    inset-inline-start: anchor(--filter-trigger left);\n    position: fixed; /* Anchor positioning requires fixed positioning */\n    /* stylelint-disable-next-line property-no-unknown */\n    position-anchor: --filter-trigger;\n\n    /* CSS position-try disabled for precise JavaScript-controlled flipping */\n\n    /* Flipping classes applied by JavaScript for precise control */\n    &.popover-flip-horizontal {\n      inset-inline-start: anchor(--filter-trigger right);\n      transform: translateX(-100%);\n    }\n\n    &.popover-flip-vertical {\n      inset-block-start: anchor(--filter-trigger top);\n      transform: translateY(calc(-100% - var(--pine-dimension-100)));\n    }\n\n    &.popover-flip-horizontal.popover-flip-vertical {\n      inset-block-start: anchor(--filter-trigger top);\n      inset-inline-start: anchor(--filter-trigger right);\n      transform: translate(-100%, calc(-100% - var(--pine-dimension-100)));\n    }\n\n    /* Ensure fallback class works with flipping in modern browsers */\n    &.is-open.popover-flip-horizontal {\n      inset-inline-start: anchor(--filter-trigger right);\n      transform: translateX(-100%);\n    }\n\n    &.is-open.popover-flip-vertical {\n      inset-block-start: anchor(--filter-trigger top);\n      transform: translateY(calc(-100% - var(--pine-dimension-100)));\n    }\n\n    &.is-open.popover-flip-horizontal.popover-flip-vertical {\n      inset-block-start: anchor(--filter-trigger top);\n      inset-inline-start: anchor(--filter-trigger right);\n      transform: translate(-100%, calc(-100% - var(--pine-dimension-100)));\n    }\n\n  }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop, State, Method, Listen } from '@stencil/core';\nimport type { BasePdsProps } from '@utils/interfaces';\nimport type { PdsFilterOpenEventDetail, PdsFilterCloseEventDetail, PdsFilterClearEventDetail, PdsFilterVariant } from './filter-interface';\n\nimport { enlarge, trash } from '@pine-ds/icons/icons';\n\n/**\n * Individual filter component with cross-browser popover positioning.\n *\n * Uses a hybrid approach for optimal cross-browser compatibility:\n * - Modern browsers: CSS anchor positioning + JavaScript flip classes\n * - Fallback browsers: JavaScript positioning with viewport boundary detection\n *\n * @part button - Exposes the trigger button element for styling.\n * @part button-content - Exposes the button content container for styling.\n * @part button-text - Exposes the button text for styling.\n * @part icon - Exposes the icon component for styling.\n * @part popover - Exposes the popover container for styling.\n * @slot (default) - Popover content that will be displayed when the filter is open.\n */\n\n@Component({\n  tag: 'pds-filter',\n  styleUrl: 'pds-filter.scss',\n  shadow: true,\n})\nexport class PdsFilter implements BasePdsProps {\n  @Element() el!: HTMLPdsFilterElement;\n\n  private popoverEl: HTMLElement;\n  private scrollRAF: number | null = null;\n  private lastScrollTime = 0;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * The variant style of the filter trigger.\n   * @defaultValue 'default'\n   */\n  @Prop() variant: PdsFilterVariant = 'default';\n\n  /**\n   * The name of the icon to display in the trigger button.\n   * For 'clear' variant, this is ignored as it always shows trash icon.\n   */\n  @Prop() icon?: string;\n\n  /**\n   * The text content displayed in the trigger button.\n   */\n  @Prop() text?: string;\n\n\n  /**\n   * State to track if the popover is open.\n   */\n  @State() isOpen = false;\n\n  /**\n   * Event emitted when the filter popover is opened.\n   */\n  @Event() pdsFilterOpen: EventEmitter<PdsFilterOpenEventDetail>;\n\n  /**\n   * Event emitted when the filter popover is closed.\n   */\n  @Event() pdsFilterClose: EventEmitter<PdsFilterCloseEventDetail>;\n\n  /**\n   * Event emitted when the clear variant is clicked.\n   */\n  @Event() pdsFilterClear: EventEmitter<PdsFilterClearEventDetail>;\n\n\n  /**\n   * Component lifecycle: Clean up when disconnected from DOM.\n   * Prevents memory leaks by canceling pending operations and closing popovers.\n   */\n  disconnectedCallback() {\n    // Cancel pending animation frames\n    if (this.scrollRAF) {\n      cancelAnimationFrame(this.scrollRAF);\n      this.scrollRAF = null;\n    }\n\n    this.lastScrollTime = 0;\n\n    // Clean up native popover event listeners\n    if (this.popoverEl) {\n      const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n      if (supportsPopoverAPI) {\n        this.popoverEl.removeEventListener('toggle', this.handleNativePopoverToggle);\n      }\n    }\n\n    // Ensure popover is closed\n    if (this.isOpen && this.popoverEl) {\n      try {\n        this.popoverEl.hidePopover();\n      } catch (error) {\n        this.popoverEl.style.display = 'none';\n        this.popoverEl.classList.remove('is-open');\n      }\n    }\n  }\n\n\n  componentDidRender() {\n    // Note: popoverEl is set via ref callback in render method\n    // For browsers with native popover API, we need direct element listeners\n    // since the document listener may not capture native popover toggle events\n    if (this.popoverEl) {\n      const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n      if (supportsPopoverAPI) {\n        // Remove any existing listeners to avoid duplicates\n        this.popoverEl.removeEventListener('toggle', this.handleNativePopoverToggle);\n        // Add direct listener for native popover events\n        this.popoverEl.addEventListener('toggle', this.handleNativePopoverToggle);\n      }\n    }\n  }\n\n  /**\n   * Handle native popover toggle events directly on the element\n   * This is needed for browsers with native Popover API support\n   */\n  private handleNativePopoverToggle = (event: Event) => {\n    const target = event.target as HTMLElement;\n\n    if (target && target.id === `${this.componentId}-popover`) {\n      // Check current popover state\n      let isCurrentlyOpen = false;\n      try {\n        isCurrentlyOpen = target.matches(':popover-open');\n      } catch (error) {\n        // Fallback if :popover-open selector isn't supported\n        isCurrentlyOpen = target.style.display === 'block';\n      }\n\n      // Update state\n      this.isOpen = isCurrentlyOpen;\n\n      if (this.isOpen) {\n        setTimeout(() => this.adjustPopoverPosition(), 0);\n\n        this.pdsFilterOpen.emit({\n          componentId: this.componentId,\n          variant: this.variant,\n          text: this.text,\n        });\n      } else {\n        this.pdsFilterClose.emit({\n          componentId: this.componentId,\n          variant: this.variant,\n          text: this.text,\n        });\n      }\n    }\n  };\n\n  /**\n   * Reposition popovers on window resize.\n   */\n  @Listen('resize', { target: 'window' })\n  handleWindowResize() {\n    if (this.isOpen) {\n      setTimeout(() => this.adjustPopoverPosition(), 16);\n    }\n  }\n\n  /**\n   * Reposition popovers on scroll with performance throttling.\n   */\n  @Listen('scroll', { target: 'window', passive: true })\n  handleWindowScroll() {\n    if (this.isOpen) {\n      const supportsAnchorPositioning = \"anchorName\" in document.documentElement.style;\n      const now = performance.now();\n\n      const throttleMs = supportsAnchorPositioning ? 66 : 33;\n      if (now - this.lastScrollTime < throttleMs) {\n        return;\n      }\n\n      this.lastScrollTime = now;\n\n      if (this.scrollRAF) {\n        cancelAnimationFrame(this.scrollRAF);\n      }\n\n      this.scrollRAF = requestAnimationFrame(() => {\n        if (this.isOpen && this.popoverEl && this.el.isConnected) {\n          this.adjustPopoverPosition();\n        }\n        this.scrollRAF = null;\n      });\n    }\n  }\n\n  /**\n   * Closes other open filter popovers to ensure only one is open at a time.\n   */\n  private closeOtherPopovers() {\n    const allFilters = document.querySelectorAll('pds-filter');\n\n    allFilters.forEach((filter) => {\n      if (filter === this.el) return;\n\n      const popover = filter.shadowRoot?.querySelector('.pds-filter__popover') as HTMLElement;\n\n      if (popover) {\n        // Check for popover API support to avoid crashes\n        let isPopoverOpen = false;\n        try {\n          isPopoverOpen = popover.matches(':popover-open');\n        } catch (error) {\n          // Fallback if :popover-open selector isn't supported\n          isPopoverOpen = popover.style.display === 'block';\n        }\n\n        if (isPopoverOpen) {\n          try {\n            popover.hidePopover();\n          } catch (error) {\n            popover.style.display = 'none';\n            popover.classList.remove('is-open');\n          }\n        }\n      }\n    });\n  }\n\n  /**\n   * Adjusts popover position to keep it within viewport bounds.\n   * Uses CSS anchor positioning for modern browsers, JavaScript for fallback browsers.\n   */\n  private adjustPopoverPosition() {\n    if (!this.popoverEl || this.variant === 'clear') return;\n\n    const triggerEl = this.el.shadowRoot?.querySelector('.pds-filter__trigger') as HTMLElement;\n    if (!triggerEl) return;\n\n    const triggerRect = triggerEl.getBoundingClientRect();\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n\n    const supportsAnchorPositioning = \"anchorName\" in document.documentElement.style;\n\n    // Get dimensions for boundary detection\n    const popoverWidth = 228;\n    const popoverHeight = this.popoverEl.getBoundingClientRect().height || 200;\n\n    // Boundary detection for flipping\n    const bufferSpace = 20;\n    const wouldOverflowRight = (triggerRect.left + popoverWidth + bufferSpace) > viewportWidth;\n    const wouldOverflowBottom = (triggerRect.bottom + 8 + popoverHeight + bufferSpace) > viewportHeight;\n\n    if (supportsAnchorPositioning) {\n      // Modern browsers: CSS anchor positioning + JavaScript-controlled flipping\n      this.popoverEl.classList.remove('popover-flip-horizontal', 'popover-flip-vertical');\n\n      if (wouldOverflowRight) {\n        this.popoverEl.classList.add('popover-flip-horizontal');\n      }\n\n      if (wouldOverflowBottom) {\n        this.popoverEl.classList.add('popover-flip-vertical');\n      }\n\n    } else {\n      // Fallback browsers: JavaScript positioning with boundary detection\n      let left = triggerRect.left;\n      let top = triggerRect.bottom + 8;\n      let transformOrigin = 'top left';\n\n      // Apply horizontal flipping if needed\n      if (wouldOverflowRight) {\n        const actualPopoverWidth = this.popoverEl.getBoundingClientRect().width || popoverWidth;\n        left = triggerRect.right - actualPopoverWidth;\n        transformOrigin = 'top right';\n      }\n\n      // Apply vertical flipping if needed\n      if (wouldOverflowBottom) {\n        top = triggerRect.top - popoverHeight - 8;\n        transformOrigin = transformOrigin.replace('top', 'bottom');\n      }\n\n      // Apply positioning in single DOM write for performance\n      this.popoverEl.style.cssText = `\n        position: fixed;\n        left: ${left}px;\n        top: ${top}px;\n        z-index: var(--pine-z-index-overlay);\n        transform-origin: ${transformOrigin};\n      `;\n    }\n  }\n\n  /**\n   * Opens the filter popover programmatically.\n   * Note: Clear variant does not support popover functionality.\n   */\n  @Method()\n  async showFilter() {\n    if (this.variant === 'clear') {\n      console.warn('Clear variant does not support showFilter method');\n      return;\n    }\n\n    if (this.popoverEl != null) {\n      try {\n        this.popoverEl.showPopover();\n      } catch (error) {\n        // Fallback for testing environment where showPopover is not available\n        this.popoverEl.style.display = 'block';\n        this.popoverEl.classList.add('is-open');\n      }\n    }\n  }\n\n  /**\n   * Closes the filter popover programmatically.\n   * Note: Clear variant does not support popover functionality.\n   */\n  @Method()\n  async hideFilter() {\n    if (this.variant === 'clear') {\n      console.warn('Clear variant does not support hideFilter method');\n      return;\n    }\n\n    if (this.popoverEl != null) {\n      try {\n        this.popoverEl.hidePopover();\n      } catch (error) {\n        // Fallback for testing environment where hidePopover is not available\n        this.popoverEl.style.display = 'none';\n        this.popoverEl.classList.remove('is-open');\n      }\n    }\n  }\n\n  /**\n   * Listen for popover toggle events for browsers without native Popover API (fallback).\n   * Native API browsers use direct element listeners to avoid conflicts.\n   */\n  @Listen('toggle', { target: 'document' })\n  handlePopoverToggle(event: Event) {\n    const target = event.target as HTMLElement;\n    const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n    // Only handle events for fallback browsers (Firefox) to avoid duplicate handling\n    if (!supportsPopoverAPI && target && target.id === `${this.componentId}-popover`) {\n      // Check for popover API support to avoid crashes\n      let isCurrentlyOpen = false;\n      try {\n        isCurrentlyOpen = target.matches(':popover-open');\n      } catch (error) {\n        // Fallback if :popover-open selector isn't supported\n        isCurrentlyOpen = target.style.display === 'block';\n      }\n\n      // Update state\n      this.isOpen = isCurrentlyOpen;\n\n      if (this.isOpen) {\n        setTimeout(() => this.adjustPopoverPosition(), 0);\n\n        this.pdsFilterOpen.emit({\n          componentId: this.componentId,\n          variant: this.variant,\n          text: this.text,\n        });\n      } else {\n        this.pdsFilterClose.emit({\n          componentId: this.componentId,\n          variant: this.variant,\n          text: this.text,\n        });\n      }\n    }\n  }\n\n  /**\n   * Listen for clicks to detect outside dismissal.\n   */\n  @Listen('click', { target: 'document' })\n  handleDocumentClick(event: Event) {\n    // Check if click is outside and popover gets closed\n    if (!this.el.contains(event.target as Node) && this.isOpen && this.variant !== 'clear') {\n      setTimeout(() => {\n        if (this.popoverEl && this.isOpen) {\n          // Check for popover API support to avoid crashes\n          const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n          let popoverIsClosed = false;\n          if (supportsPopoverAPI) {\n            try {\n              popoverIsClosed = !this.popoverEl.matches(':popover-open');\n            } catch (error) {\n              // Fallback if :popover-open selector isn't supported\n              popoverIsClosed = this.popoverEl.style.display !== 'block';\n            }\n          } else {\n            // Manual fallback - assume popover was closed by outside click\n            popoverIsClosed = true;\n          }\n\n          if (popoverIsClosed) {\n            this.isOpen = false;\n            if (!supportsPopoverAPI) {\n              this.popoverEl.style.display = 'none';\n              this.popoverEl.classList.remove('is-open');\n            }\n            this.pdsFilterClose.emit({\n              componentId: this.componentId,\n              variant: this.variant,\n              text: this.text,\n            });\n          }\n        }\n      }, 0);\n    }\n  }\n\n  /**\n   * Listen for Escape key to ensure close event fires.\n   */\n  @Listen('keydown', { target: 'document' })\n  handleEscapeKey(event: KeyboardEvent) {\n    if (event.key === 'Escape' && this.isOpen && this.variant !== 'clear') {\n      // Check if popover was closed by Escape\n      setTimeout(() => {\n        if (this.popoverEl && this.isOpen) {\n          // Check for popover API support to avoid crashes\n          const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n          let popoverIsClosed = false;\n          if (supportsPopoverAPI) {\n            try {\n              popoverIsClosed = !this.popoverEl.matches(':popover-open');\n            } catch (error) {\n              // Fallback if :popover-open selector isn't supported\n              popoverIsClosed = this.popoverEl.style.display !== 'block';\n            }\n          } else {\n            // Manual fallback - assume popover was closed by Escape\n            popoverIsClosed = true;\n          }\n\n          if (popoverIsClosed) {\n            this.isOpen = false;\n            if (!supportsPopoverAPI) {\n              this.popoverEl.style.display = 'none';\n              this.popoverEl.classList.remove('is-open');\n            }\n            this.pdsFilterClose.emit({\n              componentId: this.componentId,\n              variant: this.variant,\n              text: this.text,\n            });\n          }\n        }\n      }, 0);\n    }\n  }\n\n  /**\n   * Handle keyboard interactions for clear variant only.\n   */\n  private handleKeyDown = (event: KeyboardEvent) => {\n    // Only handle clear variant manually, let native API handle everything else\n    if (this.variant === 'clear' && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault();\n      this.handleClick();\n    }\n  };\n\n  /**\n   * Handle trigger button click. Clear variant emits event, others toggle popover.\n   */\n  private handleClick = (event?: Event) => {\n    if (this.variant === 'clear') {\n      this.pdsFilterClear.emit({\n        componentId: this.componentId,\n        text: this.text,\n      });\n      return;\n    }\n\n    this.closeOtherPopovers();\n\n    // Check for popover API support\n    const supportsPopoverAPI = HTMLElement.prototype.showPopover && !navigator.userAgent.includes('Firefox');\n\n    if (!supportsPopoverAPI) {\n      // Manual fallback for browsers without popover API support\n      // Prevent default to avoid conflicts with any native behavior\n      if (event) {\n        event.preventDefault();\n      }\n\n      setTimeout(() => {\n        if (this.popoverEl != null) {\n          this.isOpen = !this.isOpen;\n          if (this.isOpen) {\n            this.popoverEl.style.display = 'block';\n            this.popoverEl.classList.add('is-open');\n            this.adjustPopoverPosition();\n            this.pdsFilterOpen.emit({\n              componentId: this.componentId,\n              variant: this.variant,\n              text: this.text,\n            });\n          } else {\n            this.popoverEl.style.display = 'none';\n            this.popoverEl.classList.remove('is-open');\n            this.pdsFilterClose.emit({\n              componentId: this.componentId,\n              variant: this.variant,\n              text: this.text,\n            });\n          }\n        }\n      }, 0);\n    }\n    // For browsers with native popover API, let the native behavior handle the toggle\n    // The toggle event listener will capture the state change and emit events\n  };\n\n  /**\n   * Get the appropriate icon for the variant.\n   */\n  private getIcon() {\n    if (this.variant === 'clear') {\n      return trash;\n    }\n    return this.icon;\n  }\n\n  /**\n   * Get CSS classes for the trigger button.\n   */\n  private getTriggerClasses() {\n    const classes = ['pds-filter__trigger'];\n    classes.push(`pds-filter__trigger--${this.variant}`);\n\n    if (this.isOpen && this.variant !== 'clear') {\n      classes.push('pds-filter__trigger--open');\n    }\n\n    return classes.join(' ');\n  }\n\n  /**\n   * Render the trigger icon.\n   */\n  private renderIcon() {\n    const iconToRender = this.getIcon();\n    if (iconToRender == null || iconToRender === '') return null;\n\n    return (\n      <pds-icon\n        icon={iconToRender}\n        size=\"var(--pine-font-size-100)\"\n        aria-hidden=\"true\"\n        part=\"icon\"\n      />\n    );\n  }\n\n  /**\n   * Render the dropdown icon for selected variant.\n   */\n  private renderDropdownIcon() {\n    if (this.variant === 'selected') {\n      return (\n        <pds-icon\n          icon={enlarge}\n          size=\"var(--pine-dimension-200)\"\n          aria-hidden=\"true\"\n          class=\"pds-filter__dropdown-icon\"\n          part=\"icon\"\n        />\n      );\n    }\n    return null;\n  }\n\n  render() {\n    return (\n      <Host id={this.componentId}>\n        <button\n          class={this.getTriggerClasses()}\n          type=\"button\"\n          popoverTarget={this.variant !== 'clear' ? `${this.componentId}-popover` : undefined}\n          popoverTargetAction={this.variant !== 'clear' ? 'toggle' : undefined}\n          onKeyDown={this.variant === 'clear' ? this.handleKeyDown : undefined}\n          onClick={(event) => this.handleClick(event)}\n          part=\"button\"\n          aria-expanded={this.isOpen ? 'true' : 'false'}\n          aria-haspopup={this.variant !== 'clear' ? 'true' : undefined}\n          aria-controls={this.variant !== 'clear' ? `${this.componentId}-popover` : undefined}\n        >\n          <span class=\"pds-filter__button-content\" part=\"button-content\">\n            {this.renderIcon()}\n            {this.text && (\n              <span class=\"pds-filter__button-text\" part=\"button-text\">\n                {this.text}\n              </span>\n            )}\n            {this.renderDropdownIcon()}\n          </span>\n        </button>\n\n        {this.variant !== 'clear' && (\n          <div\n            ref={el => this.popoverEl = el}\n            id={`${this.componentId}-popover`}\n            class=\"pds-filter__popover\"\n            popover=\"auto\"\n            part=\"popover\"\n          >\n            <slot />\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pine-core/p-d61f3ab0.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsBoxCss","PdsBox","exports","class_1","hostRef","this","border","prototype","render","boxClasses","concat","alignItems","undefined","trim","alignItemsXs","alignItemsSm","alignItemsMd","alignItemsLg","alignItemsXl","alignSelf","alignSelfXs","alignSelfSm","alignSelfMd","alignSelfLg","alignSelfXl","auto","autoXs","autoSm","autoMd","autoLg","autoXl","borderRadius","direction","display","fit","fitXs","fitSm","fitMd","fitLg","fitXl","gap","gapXs","gapSm","gapMd","gapLg","gapXl","wrap","wrapXs","wrapSm","wrapMd","wrapLg","wrapXl","flex","includes","justifyContent","justifyContentXs","justifyContentSm","justifyContentMd","justifyContentLg","justifyContentXl","marginBlockStart","marginBlockStartXs","marginBlockStartSm","marginBlockStartMd","marginBlockStartLg","marginBlockStartXl","marginInlineStart","marginInlineStartXs","marginInlineStartSm","marginInlineStartMd","marginInlineStartLg","marginInlineStartXl","marginInlineEnd","marginInlineEndXs","marginInlineEndSm","marginInlineEndMd","marginInlineEndLg","marginInlineEndXl","marginBlockEnd","marginBlockEndXs","marginBlockEndSm","marginBlockEndMd","marginBlockEndLg","marginBlockEndXl","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","padding","paddingXs","paddingSm","paddingMd","paddingLg","paddingXl","paddingBlockStart","paddingBlockStartXs","paddingBlockStartSm","paddingBlockStartMd","paddingBlockStartLg","paddingBlockStartXl","paddingBlockEnd","paddingBlockEndXs","paddingBlockEndSm","paddingBlockEndMd","paddingBlockEndLg","paddingBlockEndXl","paddingInlineStart","paddingInlineStartXs","paddingInlineStartSm","paddingInlineStartMd","paddingInlineStartLg","paddingInlineStartXl","paddingInlineEnd","paddingInlineEndXs","paddingInlineEndSm","paddingInlineEndMd","paddingInlineEndLg","paddingInlineEndXl","shadow","size","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","normalizedBackground","normalizeColorValue","backgroundColor","normalizedBorder","borderColor","boxInlineStyles","Object","assign","minHeight","minWidth","h","Host","key","class","style"],"sources":["src/components/pds-box/pds-box.scss?tag=pds-box","src/components/pds-box/pds-box.tsx"],"sourcesContent":["@use './pds-box.mixins' as *;\n\npds-box {\n  --border-width-default: var(--pine-border-width-thin);\n  --color-background-box: inherit;\n  --color-border-box: inherit;\n\n  display: block;\n}\n\n[class*='pds-box'] {\n  background-color: var(--color-background-box);\n  box-sizing: border-box;\n  display: inline-flex;\n\n  &[min-height] {\n    min-height: var(--sizing-min-height-box);\n  }\n\n  &[min-width] {\n    min-width: var(--sizing-min-width-box);\n  }\n\n  // The immediate child of the row will fit the width of the row\n  .pds-row > & {\n    position: relative;\n    width: 100%;\n\n    &.pds-box--auto {\n      width: auto;\n    }\n  }\n}\n\n// Spacing mixin\n$pine-spacing-tokens: (\n  xxs: 4px,\n  xs: 8px,\n  sm: 16px,\n  md: 24px,\n  lg: 36px,\n  xl: 48px,\n  xxl: 64px,\n);\n\n// Generate spacing classes\n@include generate-spacing-classes(false, $pine-spacing-tokens);\n@include generate-spacing-classes('top', $pine-spacing-tokens);\n@include generate-spacing-classes('right', $pine-spacing-tokens);\n@include generate-spacing-classes('left', $pine-spacing-tokens);\n@include generate-spacing-classes('bottom', $pine-spacing-tokens);\n\n// Base offset classes\n@include generate-column-offsets(false, 12);\n\n// Responsive offset classes\n@media (max-width: 575px) {\n  @include generate-column-offsets('xs', 12);\n}\n\n@media (min-width: 576px) {\n  @include generate-column-offsets('sm', 12);\n}\n\n@media (min-width: 768px) {\n  @include generate-column-offsets('md', 12);\n}\n\n@media (min-width: 992px) {\n  @include generate-column-offsets('lg', 12);\n}\n\n@media (min-width: 1200px) {\n  @include generate-column-offsets('xl', 12);\n}\n\n\n// Base column width classes\n@include generate-columns(false, 12);\n\n// Responsive column width classes\n@media (max-width: 575px) {\n  @include generate-columns('xs', 12);\n}\n\n@media (min-width: 576px) {\n  @include generate-columns('sm', 12);\n}\n\n@media (min-width: 768px) {\n  @include generate-columns('md', 12);\n}\n\n@media (min-width: 992px) {\n  @include generate-columns('lg', 12);\n}\n\n@media (min-width: 1200px) {\n  @include generate-columns('xl', 12);\n}\n\n.pds-box {\n  flex-basis: 0;\n  flex-grow: 1;\n}\n\n.pds-row > .pds-box[class*='pds-box-'] {\n  flex-basis: auto;\n}\n\n.pds-box--auto {\n  flex: 0 0 var(--sizing-min-width-box, fit-content);\n  min-width: auto;\n  width: auto;\n}\n\n.pds-box--fit {\n  max-width: 100%;\n  min-width: 100%;\n  width: 100%;\n}\n\n.pds-box--border {\n  border-color: var(--color-border-box, var(--pine-color-grey-300));\n  border-style: solid;\n  border-width: var(--border-width-default);\n}\n\n// Display helpers\n.pds-box--display-flex {\n  display: flex;\n}\n\n.pds-box--display-inline-flex {\n  display: inline-flex;\n}\n\n.pds-box--display-block {\n  display: block;\n}\n\n.pds-box--display-inline-block {\n  display: inline-block;\n}\n\n// Flex helpers\n.pds-box--flex-none {\n  flex: 0 0 auto;\n}\n\n.pds-box--flex-grow {\n  flex: 1 1 auto\n}\n\n.pds-box--flex-shrink {\n  flex: 0 0 auto;\n}\n\n// Border radius helpers\n.pds-border-radius-none {\n  border-radius: 0;\n}\n\n.pds-border-radius-xs {\n  border-radius: var(--pine-dimension-2xs);\n}\n\n.pds-border-radius-sm {\n  border-radius: var(--pine-dimension-xs);\n}\n\n.pds-border-radius-md {\n  border-radius: var(--pine-dimension-125);\n}\n\n.pds-border-radius-lg {\n  border-radius: var(--pine-dimension-sm);\n}\n\n.pds-border-radius-circle {\n  border-radius: var(--pine-border-radius-full);\n}\n\n// Box shadow helpers\n.pds-shadow-050 {\n  box-shadow: var(--pine-box-shadow-050);\n}\n\n.pds-shadow-100 {\n  box-shadow: var(--pine-box-shadow-100);\n}\n\n.pds-shadow-150 {\n  box-shadow: var(--pine-box-shadow-150);\n}\n\n.pds-shadow-200 {\n  box-shadow: var(--pine-box-shadow-200);\n}\n\n.pds-shadow-300 {\n  box-shadow: var(--pine-box-shadow-300);\n}\n\n.pds-shadow-400 {\n  box-shadow: var(--pine-box-shadow-400);\n}\n\n.pds-shadow-500 {\n  box-shadow: var(--pine-box-shadow-500);\n}\n\n\n.pds-shadow-xs {\n  box-shadow: var(--pine-box-shadow-050);\n}\n\n.pds-shadow-sm {\n  box-shadow: var(--pine-box-shadow-100);\n}\n\n.pds-shadow-md {\n  box-shadow: var(--pine-box-shadow-150);\n}\n\n.pds-shadow-lg {\n  box-shadow: var(--pine-box-shadow-200);\n}\n\n// Gap helpers\n.pds-box-gap-none {\n  gap: 0;\n}\n\n.pds-box-gap-xxs {\n  gap: var(--pine-dimension-2xs);\n}\n\n.pds-box-gap-xs {\n  gap: var(--pine-dimension-xs);\n}\n\n.pds-box-gap-sm {\n  gap: var(--pine-dimension-sm);\n}\n\n.pds-box-gap-md {\n  gap: var(--pine-dimension-md);\n}\n\n.pds-box-gap-lg {\n  gap: var(--pine-dimension-lg);\n}\n\n.pds-box-gap-xl {\n  gap: var(--pine-dimension-xl);\n}\n\n.pds-box-gap-xxl {\n  gap: var(--pine-dimension-2xl);\n}\n\n// Margin helpers\n.pds-margin-block-start-xxs {\n  margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-margin-block-start-xs {\n  margin-block-start: var(--pine-dimension-xs);\n}\n\n.pds-margin-block-start-sm {\n  margin-block-start: var(--pine-dimension-sm);\n}\n\n.pds-margin-block-start-md {\n  margin-block-start: var(--pine-dimension-md);\n}\n\n.pds-margin-block-start-lg {\n  margin-block-start: var(--pine-dimension-lg);\n}\n\n.pds-margin-block-start-xl {\n  margin-block-start: var(--pine-dimension-xl);\n}\n\n.pds-margin-block-start-xxl {\n  margin-block-start: var(--pine-dimension-2xl);\n}\n\n.pds-margin-inline-start-none {\n  margin-inline-start: 0;\n}\n\n.pds-margin-inline-start-xxs {\n  margin-inline-start: var(--pine-dimension-2xs);\n}\n\n.pds-margin-inline-start-xs {\n  margin-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-margin-inline-start-sm {\n  margin-inline-start: var(--pine-dimension-sm);\n}\n\n.pds-margin-inline-start-md {\n  margin-inline-start: var(--pine-dimension-md);\n}\n\n.pds-margin-inline-start-lg {\n  margin-inline-start: var(--pine-dimension-lg);\n}\n\n.pds-margin-inline-start-xl {\n  margin-inline-start: var(--pine-dimension-xl);\n}\n\n.pds-margin-inline-start-xxl {\n  margin-inline-start: var(--pine-dimension-2xl);\n}\n\n.pds-margin-inline-end-none {\n  margin-inline-end: 0;\n}\n\n.pds-margin-inline-end-xxs {\n  margin-inline-end: var(--pine-dimension-2xs);\n}\n\n.pds-margin-inline-end-xs {\n  margin-inline-end: var(--pine-dimension-xs);\n}\n\n.pds-margin-inline-end-sm {\n  margin-inline-end: var(--pine-dimension-sm);\n}\n\n.pds-margin-inline-end-md {\n  margin-inline-end: var(--pine-dimension-md);\n}\n\n.pds-margin-inline-end-lg {\n  margin-inline-end: var(--pine-dimension-lg);\n}\n\n.pds-margin-inline-end-xl {\n  margin-inline-end: var(--pine-dimension-xl);\n}\n\n.pds-margin-inline-end-xxl {\n  margin-inline-end: var(--pine-dimension-2xl);\n}\n\n.pds-margin-block-end-none {\n  margin-block-end: 0;\n}\n\n.pds-margin-block-end-xxs {\n  margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-margin-block-end-xs {\n  margin-block-end: var(--pine-dimension-xs);\n}\n\n.pds-margin-block-end-sm {\n  margin-block-end: var(--pine-dimension-sm);\n}\n\n.pds-margin-block-end-md {\n  margin-block-end: var(--pine-dimension-md);\n}\n\n.pds-margin-block-end-lg {\n  margin-block-end: var(--pine-dimension-lg);\n}\n\n.pds-margin-block-end-xl {\n  margin-block-end: var(--pine-dimension-xl);\n}\n\n.pds-margin-block-end-xxl {\n  margin-block-end: var(--pine-dimension-2xl);\n}\n\n// Padding helpers\n.pds-padding-none {\n  padding: 0;\n}\n\n.pds-padding-xxs {\n  padding: var(--pine-dimension-2xs);\n}\n\n.pds-padding-xs {\n  padding: var(--pine-dimension-xs);\n}\n\n.pds-padding-sm {\n  padding: var(--pine-dimension-sm);\n}\n\n.pds-padding-md {\n  padding: var(--pine-dimension-md);\n}\n\n.pds-padding-lg {\n  padding: var(--pine-dimension-lg);\n}\n\n.pds-padding-xl {\n  padding: var(--pine-dimension-xl);\n}\n\n.pds-padding-xxl {\n  padding: var(--pine-dimension-2xl);\n}\n\n// Padding block start helpers\n.pds-padding-block-start-none {\n  padding-block-start: var(--pine-dimension-none);\n}\n\n.pds-padding-block-start-xxs {\n  padding-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-padding-block-start-xs {\n  padding-block-start: var(--pine-dimension-xs);\n}\n\n.pds-padding-block-start-sm {\n  padding-block-start: var(--pine-dimension-sm);\n}\n\n.pds-padding-block-start-md {\n  padding-block-start: var(--pine-dimension-md);\n}\n\n.pds-padding-block-start-lg {\n  padding-block-start: var(--pine-dimension-lg);\n}\n\n.pds-padding-block-start-xl {\n  padding-block-start: var(--pine-dimension-xl);\n}\n\n.pds-padding-block-start-xxl {\n  padding-block-start: var(--pine-dimension-2xl);\n}\n\n// Padding block end helpers\n.pds-padding-block-end-none {\n  padding-block-end: var(--pine-dimension-none);\n}\n\n.pds-padding-block-end-xxs {\n  padding-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-padding-block-end-xs {\n  padding-block-end: var(--pine-dimension-xs);\n}\n\n.pds-padding-block-end-sm {\n  padding-block-end: var(--pine-dimension-sm);\n}\n\n.pds-padding-block-end-md {\n  padding-block-end: var(--pine-dimension-md);\n}\n\n.pds-padding-block-end-lg {\n  padding-block-end: var(--pine-dimension-lg);\n}\n\n.pds-padding-block-end-xl {\n  padding-block-end: var(--pine-dimension-xl);\n}\n\n.pds-padding-block-end-xxl {\n  padding-block-end: var(--pine-dimension-2xl);\n}\n\n// Padding inline start helpers\n.pds-padding-inline-start-none {\n  padding-inline-start: var(--pine-dimension-none);\n}\n\n.pds-padding-inline-start-xxs {\n  padding-inline-start: var(--pine-dimension-2xs);\n}\n\n.pds-padding-inline-start-xs {\n  padding-inline-start: var(--pine-dimension-xs);\n}\n\n.pds-padding-inline-start-sm {\n  padding-inline-start: var(--pine-dimension-sm);\n}\n\n.pds-padding-inline-start-md {\n  padding-inline-start: var(--pine-dimension-md);\n}\n\n.pds-padding-inline-start-lg {\n  padding-inline-start: var(--pine-dimension-lg);\n}\n\n.pds-padding-inline-start-xl {\n  padding-inline-start: var(--pine-dimension-xl);\n}\n\n.pds-padding-inline-start-xxl {\n  padding-inline-start: var(--pine-dimension-2xl);\n}\n\n// Padding inline end helpers\n.pds-padding-inline-end-none {\n  padding-inline-end: var(--pine-dimension-none);\n}\n\n.pds-padding-inline-end-xxs {\n  padding-inline-end: var(--pine-dimension-2xs);\n}\n\n.pds-padding-inline-end-xs {\n  padding-inline-end: var(--pine-dimension-xs);\n}\n\n.pds-padding-inline-end-sm {\n  padding-inline-end: var(--pine-dimension-sm);\n}\n\n.pds-padding-inline-end-md {\n  padding-inline-end: var(--pine-dimension-md);\n}\n\n.pds-padding-inline-end-lg {\n  padding-inline-end: var(--pine-dimension-lg);\n}\n\n.pds-padding-inline-end-xl {\n  padding-inline-end: var(--pine-dimension-xl);\n}\n\n.pds-padding-inline-end-xxl {\n  padding-inline-end: var(--pine-dimension-2xl);\n}\n\n\n// Display helpers\n.pds-box-display-block {\n  display: block;\n}\n\n.pds-box-display-inline-block {\n  display: inline-block;\n}\n\n.pds-box-display-flex {\n  display: flex;\n}\n\n.pds-box-display-inline-flex {\n  display: inline-flex;\n}\n\n// Flex Direction helpers\n.pds-box-direction-row {\n  flex-direction: row;\n}\n\n.pds-box-direction-column {\n  flex-direction: column;\n}\n\n// Flex Wrap helpers\n.pds-box--wrap {\n  flex-wrap: wrap;\n}\n\n// Maps for flex properties\n$justify-content-values: (\n  'start': start,\n  'center': center,\n  'end': end,\n  'space-between': space-between,\n  'space-around': space-around,\n  'space-evenly': space-evenly\n);\n\n$align-items-values: (\n  'start': start,\n  'center': center,\n  'end': end,\n  'baseline': baseline,\n  'stretch': stretch\n);\n\n$align-self-values: (\n  'start': start,\n  'center': center,\n  'end': end,\n  'baseline': baseline,\n  'stretch': stretch\n);\n\n$breakpoints: (\n  'xs': '(max-width: 575px)',\n  'sm': '(min-width: 576px)',\n  'md': '(min-width: 768px)',\n  'lg': '(min-width: 992px)',\n  'xl': '(min-width: 1200px)'\n);\n\n// Justify Content helpers\n@each $name, $value in $justify-content-values {\n  .pds-justify-content-#{$name} {\n    justify-content: $value;\n  }\n}\n\n// Responsive Justify Content helpers\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    @each $name, $value in $justify-content-values {\n      .pds-justify-content-#{$breakpoint-name}-#{$name} {\n        justify-content: $value;\n      }\n    }\n  }\n}\n\n// Align Items helpers\n@each $name, $value in $align-items-values {\n  .pds-align-items-#{$name} {\n    align-items: $value;\n  }\n}\n\n// Responsive Align Items helpers\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    @each $name, $value in $align-items-values {\n      .pds-align-items-#{$breakpoint-name}-#{$name} {\n        align-items: $value;\n      }\n    }\n  }\n}\n\n// Align Self helpers\n@each $name, $value in $align-self-values {\n  .pds-align-self-#{$name} {\n    align-self: $value;\n  }\n}\n\n// Responsive Align Self helpers\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    @each $name, $value in $align-self-values {\n      .pds-align-self-#{$breakpoint-name}-#{$name} {\n        align-self: $value;\n      }\n    }\n  }\n}\n\n// Responsive Flex Wrap helpers\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    .pds-box--wrap-#{$breakpoint-name} {\n      flex-wrap: wrap;\n    }\n  }\n}\n\n// Responsive Auto helpers\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    .pds-box--auto-#{$breakpoint-name} {\n      flex: 0 0 var(--sizing-min-width-box, fit-content);\n      min-width: auto;\n      width: auto;\n    }\n  }\n}\n\n// Responsive Fit helpers\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    .pds-box--fit-#{$breakpoint-name} {\n      max-width: 100%;\n      min-width: 100%;\n      width: 100%;\n    }\n  }\n}\n\n// Responsive Gap helpers\n$gap-values: (\n  'none': 0,\n  'xxs': var(--pine-dimension-2xs),\n  'xs': var(--pine-dimension-xs),\n  'sm': var(--pine-dimension-sm),\n  'md': var(--pine-dimension-md),\n  'lg': var(--pine-dimension-lg),\n  'xl': var(--pine-dimension-xl),\n  'xxl': var(--pine-dimension-2xl),\n  '025': var(--pine-dimension-025),\n  '050': var(--pine-dimension-050),\n  '100': var(--pine-dimension-100),\n  '125': var(--pine-dimension-125),\n  '150': var(--pine-dimension-150),\n  '200': var(--pine-dimension-200),\n  '250': var(--pine-dimension-250),\n  '300': var(--pine-dimension-300),\n  '350': var(--pine-dimension-350),\n  '400': var(--pine-dimension-400),\n  '450': var(--pine-dimension-450),\n  '500': var(--pine-dimension-500),\n  '550': var(--pine-dimension-550),\n  '600': var(--pine-dimension-600),\n  '650': var(--pine-dimension-650),\n  '700': var(--pine-dimension-700),\n  '750': var(--pine-dimension-750),\n  '800': var(--pine-dimension-800)\n);\n\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    @each $name, $value in $gap-values {\n      .pds-box-gap-#{$breakpoint-name}-#{$name} {\n        gap: $value;\n      }\n    }\n  }\n}\n\n// Responsive Margin helpers\n$margin-values: (\n  'none': 0,\n  'xxs': var(--pine-dimension-2xs),\n  'xs': var(--pine-dimension-xs),\n  'sm': var(--pine-dimension-sm),\n  'md': var(--pine-dimension-md),\n  'lg': var(--pine-dimension-lg),\n  'xl': var(--pine-dimension-xl),\n  'xxl': var(--pine-dimension-2xl),\n  '025': var(--pine-dimension-025),\n  '050': var(--pine-dimension-050),\n  '100': var(--pine-dimension-100),\n  '125': var(--pine-dimension-125),\n  '150': var(--pine-dimension-150),\n  '200': var(--pine-dimension-200),\n  '250': var(--pine-dimension-250),\n  '300': var(--pine-dimension-300),\n  '350': var(--pine-dimension-350),\n  '400': var(--pine-dimension-400),\n  '450': var(--pine-dimension-450),\n  '500': var(--pine-dimension-500),\n  '550': var(--pine-dimension-550),\n  '600': var(--pine-dimension-600),\n  '650': var(--pine-dimension-650),\n  '700': var(--pine-dimension-700),\n  '750': var(--pine-dimension-750),\n  '800': var(--pine-dimension-800)\n);\n\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    @each $name, $value in $margin-values {\n      .pds-margin-block-start-#{$breakpoint-name}-#{$name} {\n        margin-block-start: $value;\n      }\n\n      .pds-margin-inline-start-#{$breakpoint-name}-#{$name} {\n        margin-inline-start: $value;\n      }\n\n      .pds-margin-inline-end-#{$breakpoint-name}-#{$name} {\n        margin-inline-end: $value;\n      }\n\n      .pds-margin-block-end-#{$breakpoint-name}-#{$name} {\n        margin-block-end: $value;\n      }\n    }\n  }\n}\n\n// Responsive Padding helpers\n$padding-values: (\n  'none': var(--pine-dimension-none),\n  'xxs': var(--pine-dimension-2xs),\n  'xs': var(--pine-dimension-xs),\n  'sm': var(--pine-dimension-sm),\n  'md': var(--pine-dimension-md),\n  'lg': var(--pine-dimension-lg),\n  'xl': var(--pine-dimension-xl),\n  'xxl': var(--pine-dimension-2xl),\n  '025': var(--pine-dimension-025),\n  '050': var(--pine-dimension-050),\n  '100': var(--pine-dimension-100),\n  '125': var(--pine-dimension-125),\n  '150': var(--pine-dimension-150),\n  '200': var(--pine-dimension-200),\n  '250': var(--pine-dimension-250),\n  '300': var(--pine-dimension-300),\n  '350': var(--pine-dimension-350),\n  '400': var(--pine-dimension-400),\n  '450': var(--pine-dimension-450),\n  '500': var(--pine-dimension-500),\n  '550': var(--pine-dimension-550),\n  '600': var(--pine-dimension-600),\n  '650': var(--pine-dimension-650),\n  '700': var(--pine-dimension-700),\n  '750': var(--pine-dimension-750),\n  '800': var(--pine-dimension-800)\n);\n\n@each $breakpoint-name, $breakpoint-value in $breakpoints {\n  @media #{$breakpoint-value} {\n    @each $name, $value in $padding-values {\n      .pds-padding-#{$breakpoint-name}-#{$name} {\n        padding: $value;\n      }\n\n      .pds-padding-block-start-#{$breakpoint-name}-#{$name} {\n        padding-block-start: $value;\n      }\n\n      .pds-padding-block-end-#{$breakpoint-name}-#{$name} {\n        padding-block-end: $value;\n      }\n\n      .pds-padding-inline-start-#{$breakpoint-name}-#{$name} {\n        padding-inline-start: $value;\n      }\n\n      .pds-padding-inline-end-#{$breakpoint-name}-#{$name} {\n        padding-inline-end: $value;\n      }\n    }\n  }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\nimport { BoxColumnType, BoxSpacingType, BoxShadowSizeType } from '../../utils/types';\nimport { normalizeColorValue } from '../../utils/utils';\n\n@Component({\n  tag: 'pds-box',\n  styleUrl: 'pds-box.scss',\n})\nexport class PdsBox {\n  /**\n   * Defines how items within the box are aligned.\n   * @defaultValue stretch\n  */\n  @Prop() alignItems?: `start` | `center` | `end` | `baseline` | `stretch` ;\n\n  /**\n   * Defines how items within the box are aligned at the XS breakpoint.\n   * @defaultValue stretch\n  */\n  @Prop() alignItemsXs?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how items within the box are aligned at the SM breakpoint.\n   * @defaultValue stretch\n  */\n  @Prop() alignItemsSm?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how items within the box are aligned at the MD breakpoint.\n   * @defaultValue stretch\n  */\n  @Prop() alignItemsMd?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how items within the box are aligned at the LG breakpoint.\n   * @defaultValue stretch\n  */\n  @Prop() alignItemsLg?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how items within the box are aligned at the XL breakpoint.\n   * @defaultValue stretch\n  */\n  @Prop() alignItemsXl?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how the box is aligned within its container.\n   * @defaultValue stretch\n  */\n  @Prop() alignSelf?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how the box is aligned within its container at the XS breakpoint.\n   *\n  */\n  @Prop() alignSelfXs?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how the box is aligned within its container at the SM breakpoint.\n   *\n  */\n  @Prop() alignSelfSm?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how the box is aligned within its container at the MD breakpoint.\n   *\n  */\n  @Prop() alignSelfMd?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how the box is aligned within its container at the LG breakpoint.\n   *\n  */\n  @Prop() alignSelfLg?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * Defines how the box is aligned within its container at the XL breakpoint.\n   *\n  */\n  @Prop() alignSelfXl?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n  /**\n   * If `true`, the box will be sized to fit its contents.\n   */\n  @Prop() auto?: boolean;\n\n  /**\n   * If `true`, the box will be sized to fit its contents at the XS breakpoint.\n   */\n  @Prop() autoXs?: boolean;\n\n  /**\n   * If `true`, the box will be sized to fit its contents at the SM breakpoint.\n   */\n  @Prop() autoSm?: boolean;\n\n  /**\n   * If `true`, the box will be sized to fit its contents at the MD breakpoint.\n   */\n  @Prop() autoMd?: boolean;\n\n  /**\n   * If `true`, the box will be sized to fit its contents at the LG breakpoint.\n   */\n  @Prop() autoLg?: boolean;\n\n  /**\n   * If `true`, the box will be sized to fit its contents at the XL breakpoint.\n   */\n  @Prop() autoXl?: boolean;\n\n  /**\n   *  Defines the background-color of the box.\n   */\n  @Prop() backgroundColor?: string;\n\n  /**\n   * If `true`, the box will have a border.\n   */\n  @Prop() border? = false;\n\n  /**\n   *  Defines the border color of the box.\n   */\n  @Prop() borderColor?: string;\n\n  /**\n   * Defines how rounded the box corners are.\n   * @defaultValue none\n   */\n  @Prop() borderRadius?: `none` | `xs`| `sm` | `md` | `lg` | `circle`;\n\n  /**\n   * Defines the orientation of the box items.\n   * @defaultValue row\n   */\n  @Prop() direction?: `row` | `column`;\n\n  /**\n   * Defines the display style of the box.\n   * @defaultValue flex\n  */\n  @Prop() display?: `flex` | `inline-flex` | `block` | `inline-block`;\n\n  /**\n   * If `true`, sets the box `max-width` to `100%`.\n   */\n  @Prop() fit?: boolean;\n\n  /**\n   * If `true`, sets the box `max-width` to `100%` at the XS breakpoint.\n   */\n  @Prop() fitXs?: boolean;\n\n  /**\n   * If `true`, sets the box `max-width` to `100%` at the SM breakpoint.\n   */\n  @Prop() fitSm?: boolean;\n\n  /**\n   * If `true`, sets the box `max-width` to `100%` at the MD breakpoint.\n   */\n  @Prop() fitMd?: boolean;\n\n  /**\n   * If `true`, sets the box `max-width` to `100%` at the LG breakpoint.\n   */\n  @Prop() fitLg?: boolean;\n\n  /**\n   * If `true`, sets the box `max-width` to `100%` at the XL breakpoint.\n   */\n  @Prop() fitXl?: boolean;\n\n  /**\n   * Defines the spacing between the box items.\n   * @defaultValue none\n  */\n  @Prop() gap?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() gapXs?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() gapSm?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() gapMd?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() gapLg?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() gapXl?: BoxSpacingType;\n\n  /**\n   * Defines whether flex items are forced onto one line or can wrap onto multiple lines.\n   * @defaultValue false\n   */\n  @Prop() wrap?: boolean;\n\n  /**\n   * Defines whether flex items can wrap onto multiple lines at the XS breakpoint.\n   * @defaultValue false\n   */\n  @Prop() wrapXs?: boolean;\n\n  /**\n   * Defines whether flex items can wrap onto multiple lines at the SM breakpoint.\n   * @defaultValue false\n   */\n  @Prop() wrapSm?: boolean;\n\n  /**\n   * Defines whether flex items can wrap onto multiple lines at the MD breakpoint.\n   * @defaultValue false\n   */\n  @Prop() wrapMd?: boolean;\n\n  /**\n   * Defines whether flex items can wrap onto multiple lines at the LG breakpoint.\n   * @defaultValue false\n   */\n  @Prop() wrapLg?: boolean;\n\n  /**\n   * Defines whether flex items can wrap onto multiple lines at the XL breakpoint.\n   * @defaultValue false\n   */\n  @Prop() wrapXl?: boolean;\n\n  /**\n   * Defines how a box will grow or shrink to fit the space available in its container.\n   * Can be a predefined value ('none', 'grow', 'shrink') or a custom flex value (e.g., '1', '0 1 auto').\n   * @defaultValue none\n   */\n  @Prop() flex?: `none` | `grow` | `shrink` | string;\n\n  /**\n   * Defines the horizontal alignment of the box items.\n   * @defaultValue start\n  */\n  @Prop() justifyContent?: `start` | `center` | `end` | `space-between` | `space-around` | `space-evenly`;\n\n  /**\n   * Defines the horizontal alignment of the box items at the XS breakpoint.\n   * @defaultValue start\n  */\n  @Prop() justifyContentXs?: `start` | `center` | `end` | `space-between` | `space-around` | `space-evenly`;\n\n  /**\n   * Defines the horizontal alignment of the box items at the SM breakpoint.\n   * @defaultValue start\n  */\n  @Prop() justifyContentSm?: `start` | `center` | `end` | `space-between` | `space-around` | `space-evenly`;\n\n  /**\n   * Defines the horizontal alignment of the box items at the MD breakpoint.\n   * @defaultValue start\n  */\n  @Prop() justifyContentMd?: `start` | `center` | `end` | `space-between` | `space-around` | `space-evenly`;\n\n  /**\n   * Defines the horizontal alignment of the box items at the LG breakpoint.\n   * @defaultValue start\n  */\n  @Prop() justifyContentLg?: `start` | `center` | `end` | `space-between` | `space-around` | `space-evenly`;\n\n  /**\n   * Defines the horizontal alignment of the box items at the XL breakpoint.\n   * @defaultValue start\n  */\n  @Prop() justifyContentXl?: `start` | `center` | `end` | `space-between` | `space-around` | `space-evenly`;\n\n  /**\n   * Defines the box's outer top spacing.\n   * @defaultValue none\n  */\n  @Prop() marginBlockStart?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer top spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockStartXs?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer top spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockStartSm?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer top spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockStartMd?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer top spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockStartLg?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer top spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockStartXl?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer left spacing.\n   * @defaultValue none\n  */\n  @Prop() marginInlineStart?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer left spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineStartXs?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer left spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineStartSm?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer left spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineStartMd?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer left spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineStartLg?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer left spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineStartXl?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer right spacing.\n   * @defaultValue none\n  */\n  @Prop() marginInlineEnd?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer right spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineEndXs?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer right spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineEndSm?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer right spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineEndMd?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer right spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineEndLg?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer right spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginInlineEndXl?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer bottom spacing.\n   * @defaultValue none\n  */\n  @Prop() marginBlockEnd?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer bottom spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockEndXs?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer bottom spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockEndSm?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer bottom spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockEndMd?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer bottom spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockEndLg?: BoxSpacingType;\n\n  /**\n   * Defines the box's outer bottom spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() marginBlockEndXl?: BoxSpacingType;\n\n  /**\n   * The minimum height of the row. Used in conjunction with alignment props\n   */\n  @Prop({ reflect: true }) minHeight?: string;\n\n  /**\n   * The minimum width of the row. Used in conjunction with alignment props\n   */\n  @Prop({ reflect: true }) minWidth?: string;\n\n  /**\n   * Move columns to the end direction of the row for all screen sizes. Increases the starting margin of a column by specified number of columns.\n   */\n  @Prop() offset?: BoxColumnType;\n\n  /**\n   * Move columns to the end direction of the row for `XS` screen sizes. Increases the starting margin of a column by specified number of columns.\n  */\n  @Prop() offsetXs?: BoxColumnType;\n\n  /**\n   * Move columns to the end direction of the row for `SM` screen sizes. Increases the starting margin of a column by specified number of columns.\n  */\n  @Prop() offsetSm?: BoxColumnType;\n\n  /**\n   * Move columns to the end direction of the row for `MD` screen sizes. Increases the starting margin of a column by specified number of columns.\n  */\n  @Prop() offsetMd?: BoxColumnType;\n\n  /**\n   * Move columns to the end direction of the row for `LG` screen sizes. Increases the starting margin of a column by specified number of columns.\n  */\n  @Prop() offsetLg?: BoxColumnType;\n\n  /**\n   * Move columns to the end direction of the row for `XL` screen sizes. Increases the starting margin of a column by specified number of columns.\n  */\n  @Prop() offsetXl?: BoxColumnType;\n\n  /**\n   * Defines the spacing between the box items.\n   * @defaultValue none\n  */\n  @Prop() padding?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingXs?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingSm?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingMd?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingLg?: BoxSpacingType;\n\n  /**\n   * Defines the spacing between the box items at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingXl?: BoxSpacingType;\n\n\n  /**\n   * Defines the top spacing.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockStart?: BoxSpacingType;\n\n  /**\n   * Defines the top spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockStartXs?: BoxSpacingType;\n\n  /**\n   * Defines the top spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockStartSm?: BoxSpacingType;\n\n  /**\n   * Defines the top spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockStartMd?: BoxSpacingType;\n\n  /**\n   * Defines the top spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockStartLg?: BoxSpacingType;\n\n  /**\n   * Defines the top spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockStartXl?: BoxSpacingType;\n\n  /**\n   * Defines the bottom spacing.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockEnd?: BoxSpacingType;\n\n  /**\n   * Defines the bottom spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockEndXs?: BoxSpacingType;\n\n  /**\n   * Defines the bottom spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockEndSm?: BoxSpacingType;\n\n  /**\n   * Defines the bottom spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockEndMd?: BoxSpacingType;\n\n  /**\n   * Defines the bottom spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockEndLg?: BoxSpacingType;\n\n  /**\n   * Defines the bottom spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingBlockEndXl?: BoxSpacingType;\n\n  /**\n   * Defines the left spacing.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineStart?: BoxSpacingType;\n\n  /**\n   * Defines the left spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineStartXs?: BoxSpacingType;\n\n  /**\n   * Defines the left spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineStartSm?: BoxSpacingType;\n\n  /**\n   * Defines the left spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineStartMd?: BoxSpacingType;\n\n  /**\n   * Defines the left spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineStartLg?: BoxSpacingType;\n\n  /**\n   * Defines the left spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineStartXl?: BoxSpacingType;\n\n  /**\n   * Defines the right spacing.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineEnd?: BoxSpacingType;\n\n  /**\n   * Defines the right spacing at the XS breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineEndXs?: BoxSpacingType;\n\n  /**\n   * Defines the right spacing at the SM breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineEndSm?: BoxSpacingType;\n\n  /**\n   * Defines the right spacing at the MD breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineEndMd?: BoxSpacingType;\n\n  /**\n   * Defines the right spacing at the LG breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineEndLg?: BoxSpacingType;\n\n  /**\n   * Defines the right spacing at the XL breakpoint.\n   * @defaultValue none\n  */\n  @Prop() paddingInlineEndXl?: BoxSpacingType;\n\n  /**\n   * Defines the box shadow.\n   * @defaultValue none\n  */\n  @Prop() shadow?: BoxShadowSizeType;\n\n  /**\n   * Sets the default column width for the component. This value applies from the smallest screen size (XS) upwards, unless overridden by a breakpoint-specific size prop at that breakpoint or larger.\n   */\n  @Prop() size?: BoxColumnType;\n\n  /**\n   * At the XS breakpoint, this prop will take the number of columns specified. This overrides the base size prop for this specific range.\n   */\n  @Prop() sizeXs?: BoxColumnType;\n\n  /**\n   * At screen sizes from the SM breakpoint and larger (576px and up), this will take the specified number of columns. This overrides any value set by size or sizeXs.\n   */\n  @Prop() sizeSm?: BoxColumnType;\n\n  /**\n   * At screen sizes from the MD breakpoint and larger (768px and up), this will take the specified number of columns. This overrides any value set by size, sizeXs, and up.\n   */\n  @Prop() sizeMd?: BoxColumnType;\n\n  /**\n   * At screen sizes from the LG breakpoint and larger (992px and up), this will take the specified number of columns. This overrides any value set by size, sizeXs, and up.\n   */\n  @Prop() sizeLg?: BoxColumnType;\n\n  /**\n   * At screen sizes from the XL breakpoint and larger (1200px and up), this will take the specified number of columns. This overrides any value set by size, sizeXs, and up.\n   */\n  @Prop() sizeXl?: BoxColumnType;\n\n\n\n  render() {\n    const boxClasses = `\n    ${this.alignItems !== undefined && this.alignItems.trim() !== '' ? `pds-align-items-${this.alignItems}` : ''}\n    ${this.alignItemsXs !== undefined && this.alignItemsXs.trim() !== '' ? `pds-align-items-xs-${this.alignItemsXs}` : ''}\n    ${this.alignItemsSm !== undefined && this.alignItemsSm.trim() !== '' ? `pds-align-items-sm-${this.alignItemsSm}` : ''}\n    ${this.alignItemsMd !== undefined && this.alignItemsMd.trim() !== '' ? `pds-align-items-md-${this.alignItemsMd}` : ''}\n    ${this.alignItemsLg !== undefined && this.alignItemsLg.trim() !== '' ? `pds-align-items-lg-${this.alignItemsLg}` : ''}\n    ${this.alignItemsXl !== undefined && this.alignItemsXl.trim() !== '' ? `pds-align-items-xl-${this.alignItemsXl}` : ''}\n    ${this.alignSelf !== undefined && this.alignSelf.trim() !== '' ? `pds-align-self-${this.alignSelf}` : ''}\n    ${this.alignSelfXs !== undefined && this.alignSelfXs.trim() !== '' ? `pds-align-self-xs-${this.alignSelfXs}` : ''}\n    ${this.alignSelfSm !== undefined && this.alignSelfSm.trim() !== '' ? `pds-align-self-sm-${this.alignSelfSm}` : ''}\n    ${this.alignSelfMd !== undefined && this.alignSelfMd.trim() !== '' ? `pds-align-self-md-${this.alignSelfMd}` : ''}\n    ${this.alignSelfLg !== undefined && this.alignSelfLg.trim() !== '' ? `pds-align-self-lg-${this.alignSelfLg}` : ''}\n    ${this.alignSelfXl !== undefined && this.alignSelfXl.trim() !== '' ? `pds-align-self-xl-${this.alignSelfXl}` : ''}\n    ${this.auto ? 'pds-box--auto' : ''}\n    ${this.autoXs ? 'pds-box--auto-xs' : ''}\n    ${this.autoSm ? 'pds-box--auto-sm' : ''}\n    ${this.autoMd ? 'pds-box--auto-md' : ''}\n    ${this.autoLg ? 'pds-box--auto-lg' : ''}\n    ${this.autoXl ? 'pds-box--auto-xl' : ''}\n    ${this.border ? 'pds-box--border' : ''}\n    ${this.borderRadius !== undefined && this.borderRadius.trim() !== '' ? `pds-border-radius-${this.borderRadius}` : ''}\n    ${this.direction !== undefined && this.direction.trim() !== '' ? `pds-box-direction-${this.direction}` : ''}\n    ${this.display !== undefined && this.display.trim() !== '' ? `pds-box--display-${this.display}` : ''}\n    ${this.fit ? 'pds-box--fit' : ''}\n    ${this.fitXs ? 'pds-box--fit-xs' : ''}\n    ${this.fitSm ? 'pds-box--fit-sm' : ''}\n    ${this.fitMd ? 'pds-box--fit-md' : ''}\n    ${this.fitLg ? 'pds-box--fit-lg' : ''}\n    ${this.fitXl ? 'pds-box--fit-xl' : ''}\n    ${this.gap !== undefined && this.gap.trim() !== '' ? `pds-box-gap-${this.gap}` : ''}\n    ${this.gapXs !== undefined && this.gapXs.trim() !== '' ? `pds-box-gap-xs-${this.gapXs}` : ''}\n    ${this.gapSm !== undefined && this.gapSm.trim() !== '' ? `pds-box-gap-sm-${this.gapSm}` : ''}\n    ${this.gapMd !== undefined && this.gapMd.trim() !== '' ? `pds-box-gap-md-${this.gapMd}` : ''}\n    ${this.gapLg !== undefined && this.gapLg.trim() !== '' ? `pds-box-gap-lg-${this.gapLg}` : ''}\n    ${this.gapXl !== undefined && this.gapXl.trim() !== '' ? `pds-box-gap-xl-${this.gapXl}` : ''}\n    ${this.wrap ? 'pds-box--wrap' : ''}\n    ${this.wrapXs ? 'pds-box--wrap-xs' : ''}\n    ${this.wrapSm ? 'pds-box--wrap-sm' : ''}\n    ${this.wrapMd ? 'pds-box--wrap-md' : ''}\n    ${this.wrapLg ? 'pds-box--wrap-lg' : ''}\n    ${this.wrapXl ? 'pds-box--wrap-xl' : ''}\n    ${this.flex !== undefined && this.flex.trim() !== '' && ['none', 'grow', 'shrink'].includes(this.flex) ? `pds-box--flex-${this.flex}` : ''}\n    ${this.justifyContent !== undefined && this.justifyContent.trim() !== '' ? `pds-justify-content-${this.justifyContent}` : ''}\n    ${this.justifyContentXs !== undefined && this.justifyContentXs.trim() !== '' ? `pds-justify-content-xs-${this.justifyContentXs}` : ''}\n    ${this.justifyContentSm !== undefined && this.justifyContentSm.trim() !== '' ? `pds-justify-content-sm-${this.justifyContentSm}` : ''}\n    ${this.justifyContentMd !== undefined && this.justifyContentMd.trim() !== '' ? `pds-justify-content-md-${this.justifyContentMd}` : ''}\n    ${this.justifyContentLg !== undefined && this.justifyContentLg.trim() !== '' ? `pds-justify-content-lg-${this.justifyContentLg}` : ''}\n    ${this.justifyContentXl !== undefined && this.justifyContentXl.trim() !== '' ? `pds-justify-content-xl-${this.justifyContentXl}` : ''}\n    ${this.marginBlockStart !== undefined && this.marginBlockStart.trim() !== '' ? `pds-margin-block-start-${this.marginBlockStart}` : ''}\n    ${this.marginBlockStartXs !== undefined && this.marginBlockStartXs.trim() !== '' ? `pds-margin-block-start-xs-${this.marginBlockStartXs}` : ''}\n    ${this.marginBlockStartSm !== undefined && this.marginBlockStartSm.trim() !== '' ? `pds-margin-block-start-sm-${this.marginBlockStartSm}` : ''}\n    ${this.marginBlockStartMd !== undefined && this.marginBlockStartMd.trim() !== '' ? `pds-margin-block-start-md-${this.marginBlockStartMd}` : ''}\n    ${this.marginBlockStartLg !== undefined && this.marginBlockStartLg.trim() !== '' ? `pds-margin-block-start-lg-${this.marginBlockStartLg}` : ''}\n    ${this.marginBlockStartXl !== undefined && this.marginBlockStartXl.trim() !== '' ? `pds-margin-block-start-xl-${this.marginBlockStartXl}` : ''}\n    ${this.marginInlineStart !== undefined && this.marginInlineStart.trim() !== '' ? `pds-margin-inline-start-${this.marginInlineStart}` : ''}\n    ${this.marginInlineStartXs !== undefined && this.marginInlineStartXs.trim() !== '' ? `pds-margin-inline-start-xs-${this.marginInlineStartXs}` : ''}\n    ${this.marginInlineStartSm !== undefined && this.marginInlineStartSm.trim() !== '' ? `pds-margin-inline-start-sm-${this.marginInlineStartSm}` : ''}\n    ${this.marginInlineStartMd !== undefined && this.marginInlineStartMd.trim() !== '' ? `pds-margin-inline-start-md-${this.marginInlineStartMd}` : ''}\n    ${this.marginInlineStartLg !== undefined && this.marginInlineStartLg.trim() !== '' ? `pds-margin-inline-start-lg-${this.marginInlineStartLg}` : ''}\n    ${this.marginInlineStartXl !== undefined && this.marginInlineStartXl.trim() !== '' ? `pds-margin-inline-start-xl-${this.marginInlineStartXl}` : ''}\n    ${this.marginInlineEnd !== undefined && this.marginInlineEnd.trim() !== '' ? `pds-margin-inline-end-${this.marginInlineEnd}` : ''}\n    ${this.marginInlineEndXs !== undefined && this.marginInlineEndXs.trim() !== '' ? `pds-margin-inline-end-xs-${this.marginInlineEndXs}` : ''}\n    ${this.marginInlineEndSm !== undefined && this.marginInlineEndSm.trim() !== '' ? `pds-margin-inline-end-sm-${this.marginInlineEndSm}` : ''}\n    ${this.marginInlineEndMd !== undefined && this.marginInlineEndMd.trim() !== '' ? `pds-margin-inline-end-md-${this.marginInlineEndMd}` : ''}\n    ${this.marginInlineEndLg !== undefined && this.marginInlineEndLg.trim() !== '' ? `pds-margin-inline-end-lg-${this.marginInlineEndLg}` : ''}\n    ${this.marginInlineEndXl !== undefined && this.marginInlineEndXl.trim() !== '' ? `pds-margin-inline-end-xl-${this.marginInlineEndXl}` : ''}\n    ${this.marginBlockEnd !== undefined && this.marginBlockEnd.trim() !== '' ? `pds-margin-block-end-${this.marginBlockEnd}` : ''}\n    ${this.marginBlockEndXs !== undefined && this.marginBlockEndXs.trim() !== '' ? `pds-margin-block-end-xs-${this.marginBlockEndXs}` : ''}\n    ${this.marginBlockEndSm !== undefined && this.marginBlockEndSm.trim() !== '' ? `pds-margin-block-end-sm-${this.marginBlockEndSm}` : ''}\n    ${this.marginBlockEndMd !== undefined && this.marginBlockEndMd.trim() !== '' ? `pds-margin-block-end-md-${this.marginBlockEndMd}` : ''}\n    ${this.marginBlockEndLg !== undefined && this.marginBlockEndLg.trim() !== '' ? `pds-margin-block-end-lg-${this.marginBlockEndLg}` : ''}\n    ${this.marginBlockEndXl !== undefined && this.marginBlockEndXl.trim() !== '' ? `pds-margin-block-end-xl-${this.marginBlockEndXl}` : ''}\n    ${this.offset !== undefined && this.offset.trim() !== '' ? `pds-box-offset-${this.offset}` : ''}\n    ${this.offsetXs !== undefined && this.offsetXs.trim() !== '' ? `pds-box-offset-xs-${this.offsetXs}` : ''}\n    ${this.offsetSm !== undefined && this.offsetSm.trim() !== '' ? `pds-box-offset-sm-${this.offsetSm}` : ''}\n    ${this.offsetMd !== undefined && this.offsetMd.trim() !== '' ? `pds-box-offset-md-${this.offsetMd}` : ''}\n    ${this.offsetLg !== undefined && this.offsetLg.trim() !== '' ? `pds-box-offset-lg-${this.offsetLg}` : ''}\n    ${this.offsetXl !== undefined && this.offsetXl.trim() !== '' ? `pds-box-offset-xl-${this.offsetXl}` : ''}\n    ${this.padding !== undefined && this.padding.trim() !== '' ? `pds-padding-${this.padding}` : ''}\n    ${this.paddingXs !== undefined && this.paddingXs.trim() !== '' ? `pds-padding-xs-${this.paddingXs}` : ''}\n    ${this.paddingSm !== undefined && this.paddingSm.trim() !== '' ? `pds-padding-sm-${this.paddingSm}` : ''}\n    ${this.paddingMd !== undefined && this.paddingMd.trim() !== '' ? `pds-padding-md-${this.paddingMd}` : ''}\n    ${this.paddingLg !== undefined && this.paddingLg.trim() !== '' ? `pds-padding-lg-${this.paddingLg}` : ''}\n    ${this.paddingXl !== undefined && this.paddingXl.trim() !== '' ? `pds-padding-xl-${this.paddingXl}` : ''}\n    ${this.paddingBlockStart !== undefined && this.paddingBlockStart.trim() !== '' ? `pds-padding-block-start-${this.paddingBlockStart}` : ''}\n    ${this.paddingBlockStartXs !== undefined && this.paddingBlockStartXs.trim() !== '' ? `pds-padding-block-start-xs-${this.paddingBlockStartXs}` : ''}\n    ${this.paddingBlockStartSm !== undefined && this.paddingBlockStartSm.trim() !== '' ? `pds-padding-block-start-sm-${this.paddingBlockStartSm}` : ''}\n    ${this.paddingBlockStartMd !== undefined && this.paddingBlockStartMd.trim() !== '' ? `pds-padding-block-start-md-${this.paddingBlockStartMd}` : ''}\n    ${this.paddingBlockStartLg !== undefined && this.paddingBlockStartLg.trim() !== '' ? `pds-padding-block-start-lg-${this.paddingBlockStartLg}` : ''}\n    ${this.paddingBlockStartXl !== undefined && this.paddingBlockStartXl.trim() !== '' ? `pds-padding-block-start-xl-${this.paddingBlockStartXl}` : ''}\n    ${this.paddingBlockEnd !== undefined && this.paddingBlockEnd.trim() !== '' ? `pds-padding-block-end-${this.paddingBlockEnd}` : ''}\n    ${this.paddingBlockEndXs !== undefined && this.paddingBlockEndXs.trim() !== '' ? `pds-padding-block-end-xs-${this.paddingBlockEndXs}` : ''}\n    ${this.paddingBlockEndSm !== undefined && this.paddingBlockEndSm.trim() !== '' ? `pds-padding-block-end-sm-${this.paddingBlockEndSm}` : ''}\n    ${this.paddingBlockEndMd !== undefined && this.paddingBlockEndMd.trim() !== '' ? `pds-padding-block-end-md-${this.paddingBlockEndMd}` : ''}\n    ${this.paddingBlockEndLg !== undefined && this.paddingBlockEndLg.trim() !== '' ? `pds-padding-block-end-lg-${this.paddingBlockEndLg}` : ''}\n    ${this.paddingBlockEndXl !== undefined && this.paddingBlockEndXl.trim() !== '' ? `pds-padding-block-end-xl-${this.paddingBlockEndXl}` : ''}\n    ${this.paddingInlineStart !== undefined && this.paddingInlineStart.trim() !== '' ? `pds-padding-inline-start-${this.paddingInlineStart}` : ''}\n    ${this.paddingInlineStartXs !== undefined && this.paddingInlineStartXs.trim() !== '' ? `pds-padding-inline-start-xs-${this.paddingInlineStartXs}` : ''}\n    ${this.paddingInlineStartSm !== undefined && this.paddingInlineStartSm.trim() !== '' ? `pds-padding-inline-start-sm-${this.paddingInlineStartSm}` : ''}\n    ${this.paddingInlineStartMd !== undefined && this.paddingInlineStartMd.trim() !== '' ? `pds-padding-inline-start-md-${this.paddingInlineStartMd}` : ''}\n    ${this.paddingInlineStartLg !== undefined && this.paddingInlineStartLg.trim() !== '' ? `pds-padding-inline-start-lg-${this.paddingInlineStartLg}` : ''}\n    ${this.paddingInlineStartXl !== undefined && this.paddingInlineStartXl.trim() !== '' ? `pds-padding-inline-start-xl-${this.paddingInlineStartXl}` : ''}\n    ${this.paddingInlineEnd !== undefined && this.paddingInlineEnd.trim() !== '' ? `pds-padding-inline-end-${this.paddingInlineEnd}` : ''}\n    ${this.paddingInlineEndXs !== undefined && this.paddingInlineEndXs.trim() !== '' ? `pds-padding-inline-end-xs-${this.paddingInlineEndXs}` : ''}\n    ${this.paddingInlineEndSm !== undefined && this.paddingInlineEndSm.trim() !== '' ? `pds-padding-inline-end-sm-${this.paddingInlineEndSm}` : ''}\n    ${this.paddingInlineEndMd !== undefined && this.paddingInlineEndMd.trim() !== '' ? `pds-padding-inline-end-md-${this.paddingInlineEndMd}` : ''}\n    ${this.paddingInlineEndLg !== undefined && this.paddingInlineEndLg.trim() !== '' ? `pds-padding-inline-end-lg-${this.paddingInlineEndLg}` : ''}\n    ${this.paddingInlineEndXl !== undefined && this.paddingInlineEndXl.trim() !== '' ? `pds-padding-inline-end-xl-${this.paddingInlineEndXl}` : ''}\n    ${this.shadow !== undefined && this.shadow.trim() !== '' ? `pds-shadow-${this.shadow}` : ''}\n    ${this.size !== undefined && this.size.trim() !== '' ? `pds-box pds-box-${this.size}` : ''}\n    ${this.sizeXs !== undefined && this.sizeXs.trim() !== '' ? `pds-box-xs-${this.sizeXs}` : ''}\n    ${this.sizeSm !== undefined && this.sizeSm.trim() !== '' ? `pds-box-sm-${this.sizeSm}` : ''}\n    ${this.sizeMd !== undefined && this.sizeMd.trim() !== '' ? `pds-box-md-${this.sizeMd}` : ''}\n    ${this.sizeLg !== undefined && this.sizeLg.trim() !== '' ? `pds-box-lg-${this.sizeLg}` : ''}\n    ${this.sizeXl !== undefined && this.sizeXl.trim() !== '' ? `pds-box-xl-${this.sizeXl}` : ''}\n    ${this.size == undefined &&\n      this.sizeSm == undefined &&\n      this.sizeMd == undefined &&\n      this.sizeLg == undefined &&\n      this.sizeXl == undefined ? 'pds-box' : ''}\n    `;\n\n    // Normalize so pds-box accepts --token, var(--token), or literals (no semantic names)\n    const normalizedBackground = normalizeColorValue(this.backgroundColor);\n    const normalizedBorder = normalizeColorValue(this.borderColor);\n\n    const boxInlineStyles = {\n      ...(normalizedBackground && { '--color-background-box': normalizedBackground }),\n      ...(normalizedBorder && { '--color-border-box': normalizedBorder }),\n      ...(this.minHeight && { '--sizing-min-height-box': this.minHeight }),\n      ...(this.minWidth && { '--sizing-min-width-box': this.minWidth }),\n      ...(this.flex && !['none', 'grow', 'shrink'].includes(this.flex) && { 'flex': this.flex }),\n    };\n\n    return (\n      <Host class={boxClasses} style={boxInlineStyles}>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pine-core/p-da1fb45d.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTabCss","PdsTab","exports","class_1","hostRef","this","selected","prototype","onTabClick","index","parentComponentId","pdsTabClick","emit","render","availabilityTabEdgeInlineStart","h","key","class","role","availabilityTabEdgeInlineEnd","Host","variant","slot","id","name","tabindex","onClick","bind"],"sources":["src/components/pds-tabs/pds-tab/pds-tab.scss?tag=pds-tab","src/components/pds-tabs/pds-tab/pds-tab.tsx"],"sourcesContent":["pds-tab {\n  align-items: center;\n  display: inline-flex;\n  position: relative;\n\n  .pds-tabs--pill & {\n    flex: 1;\n  }\n}\n\n///\n/// Resets base button styles\n///\n@mixin pds-button-style-reset {\n  appearance: none;\n  background-color: transparent;\n  border: var(--pine-border-width-none);\n  box-shadow: none;\n  color: inherit;\n  cursor: pointer;\n  font-family: inherit;\n  padding: var(--pine-dimension-none);\n}\n\n.pds-tab {\n  @include pds-button-style-reset();\n\n  align-items: center;\n  color: var(--pine-color-text-secondary);\n  display: inline-flex;\n  position: relative;\n  text-decoration: none;\n  white-space: nowrap;\n\n  &.is-active,\n  &[aria-selected='true'] {\n    color: var(--pine-color-text);\n\n    .pds-tab__content::after {\n      opacity: 1;\n    }\n  }\n\n  &:hover {\n    color: var(--pine-color-text);\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: var(--pine-outline-focus);\n    outline-offset: var(--pine-border-width);\n  }\n\n  .pds-tab__content {\n    font-family: var(--pine-font-family-body);\n    font-size: var(--pine-font-size);\n    font-weight: var(--pine-font-weight-medium);\n    letter-spacing: var(--pine-letter-spacing);\n    line-height: var(--pine-line-height-body);\n    padding-block-end: 11px;\n    position: relative;\n\n    &::after {\n      background-color: var(--pine-color-brand);\n      content: '';\n      height: 3px;\n      inset-block-end: var(--pine-dimension-none);\n      inset-inline-end: var(--pine-dimension-none);\n      inset-inline-start: var(--pine-dimension-none);\n      opacity: 0;\n      position: absolute;\n    }\n  }\n\n  .pds-tab-edge {\n    display: none;\n  }\n}\n\n.pds-tabs--availability {\n  --color-background-tab: transparent;\n\n  .pds-tab {\n    background-color: var(--color-background-tab);\n    border-radius: calc(var(--pine-dimension-xs) * 1.25) calc(var(--pine-dimension-xs) * 1.25) var(--pine-dimension-none) var(--pine-dimension-none);\n    padding: 8px 16px 13px;\n\n    &.is-active,\n    &[aria-selected='true'] {\n      --color-background-tab: var(--pine-color-secondary);\n\n      .pds-tab__content::after {\n        opacity: 1;\n      }\n\n      .pds-tab-edge {\n        z-index: var(--pine-z-index-raised);\n      }\n    }\n\n    &:hover:not(.is-active, [aria-selected='true']) {\n      --color-background-tab: var(--pine-color-secondary-hover);\n    }\n\n    &:focus-visible {\n      color: var(--pine-color-text-secondary);\n    }\n  }\n\n  .pds-tab__content {\n    padding-block-end: 7px;\n  }\n\n  .pds-tab-edge {\n    bottom: 0;\n    display: block;\n    height: 8px;\n    inset-inline-end: 100%;\n    overflow: hidden;\n    position: absolute;\n    width: 8px;\n\n    &::before {\n      border-radius: 50%;\n      bottom: 0;\n      box-shadow: 4px 4px 0 0 var(--color-background-tab);\n      content: '';\n      display: block;\n      height: 200%;\n      inset-inline-end: 0;\n      position: absolute;\n      width: 200%;\n    }\n  }\n\n  .pds-tab-edge--end {\n    inset-inline-end: unset;\n    inset-inline-start: 100%;\n\n    &::before {\n      box-shadow: -4px 4px 0 0 var(--color-background-tab);\n      inset-inline-end: unset;\n      inset-inline-start: 0;\n    }\n  }\n}\n\n.pds-tabs--filter {\n  .pds-tab {\n    background-color: var(--pine-color-background-container-disabled);\n    border-radius: 50px;\n    color: var(--pine-color-text);\n    padding: 6px 15px;\n\n    &.is-active,\n    &[aria-selected='true'] {\n      background-color: var(--pine-color-primary);\n      color: var(--pine-color-text-primary);\n    }\n\n    &.is-active:hover,\n    &[aria-selected='true']:hover {\n      background-color: var(--pine-color-primary-hover);\n    }\n\n    &:hover:not(.is-active, [aria-selected='true']) {\n      background-color: var(--pine-color-border-disabled);\n    }\n  }\n\n  .pds-tab__content {\n    padding-block-end: var(--pine-dimension-none);\n\n    &::after {\n      content: unset;\n    }\n  }\n}\n\n.pds-tabs--pill {\n  --color-background-tab: transparent;\n\n  .pds-tab {\n    background-color: var(--color-background-tab);\n    border: var(--pine-border-width-thin) solid transparent;\n    border-radius: var(--pine-dimension-xs);\n    color: var(--pine-color-text-readonly);\n    flex: 1;\n    height: 34px;\n    justify-content: center;\n\n    .pds-tab__content {\n      align-items: center;\n      display: flex;\n      justify-content: center;\n      padding-block-end: 0;\n    }\n\n    &.is-active,\n    &[aria-selected='true'] {\n      --color-background-tab: var(--pine-color-white);\n      border-color: var(--pine-color-border);\n      box-shadow: var(--pine-box-shadow-100);\n      color: var(--pine-color-text-active);\n\n      &:focus-visible {\n        border-color: var(--color-border-focus);\n        outline: var(--pine-outline-focus);\n        outline-offset: var(--pine-border-width);\n      }\n\n      /* stylelint-disable max-nesting-depth */\n      .pds-tab__content {\n        &::after {\n          opacity: 0;\n        }\n      }\n      /* stylelint-enable max-nesting-depth */\n    }\n  }\n}\n","import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'pds-tab',\n  styleUrl: 'pds-tab.scss',\n  shadow: false,\n})\nexport class PdsTab {\n  @Element() el: HTMLPdsTabElement;\n\n  /**\n   * Sets the related tab name, this name must match a `pds-tabpanel`'s tab name property\n   */\n  @Prop() name!: string;\n\n  /**\n   * Keeps track of the parentComponentId unique id, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() parentComponentId: string;\n\n  /**\n   * Keeps track of if the expected tab variant, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() variant: string;\n\n  /**\n   * Keeps track of if the tab index number, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() index: number;\n\n  /**\n   * Keeps track of the tabpanel selected state, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() selected = false;\n\n  /**\n   * Emits an event upon tab click for `pds-tab` and `pds-tabpanel` to listen for\n   */\n  /** @internal */\n  @Event() pdsTabClick: EventEmitter<object>;\n  private onTabClick(index, parentComponentId) {\n    this.pdsTabClick.emit([index, parentComponentId]);\n  }\n\n  render() {\n    const availabilityTabEdgeInlineStart = (\n      <span class=\"pds-tab-edge\" role=\"presentation\"></span>\n    )\n\n    const availabilityTabEdgeInlineEnd = (\n      <span class=\"pds-tab-edge pds-tab-edge--end\" role=\"presentation\"></span>\n    )\n\n    return (\n      <Host variant={this.variant} slot=\"tabs\" index={this.index}>\n        <button\n          role=\"tab\"\n          id={this.parentComponentId + \"__\" + this.name}\n          aria-controls={this.parentComponentId + \"__\" + this.name + \"-panel\"}\n          tabindex={this.selected ? \"0\" : \"-1\"}\n          aria-selected={this.selected ? \"true\" : \"false\"}\n          class={this.selected ? \"pds-tab is-active\" : \"pds-tab\"}\n          onClick={this.onTabClick.bind(this, this.index, this.parentComponentId)}\n        >\n          {this.variant === \"availability\" && availabilityTabEdgeInlineStart}\n          {this.variant === \"availability\" && availabilityTabEdgeInlineEnd}\n          <div class=\"pds-tab__content\"><slot/></div>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kKAAA,IAAMA,EAAY,4pK,ICOLC,EAAMC,EAAA,qBALnB,SAAAC,EAAAC,G,iDAmCUC,KAAQC,SAAG,KAsCpB,CA/BSH,EAAAI,UAAAC,WAAA,SAAWC,EAAOC,GACxBL,KAAKM,YAAYC,KAAK,CAACH,EAAOC,G,EAGhCP,EAAAI,UAAAM,OAAA,WACE,IAAMC,EACJC,EAAA,QAAAC,IAAA,2CAAMC,MAAM,eAAeC,KAAK,iBAGlC,IAAMC,EACJJ,EAAA,QAAAC,IAAA,2CAAMC,MAAM,iCAAiCC,KAAK,iBAGpD,OACEH,EAACK,EAAI,CAAAJ,IAAA,2CAACK,QAAShB,KAAKgB,QAASC,KAAK,OAAOb,MAAOJ,KAAKI,OACnDM,EAAA,UAAAC,IAAA,2CACEE,KAAK,MACLK,GAAIlB,KAAKK,kBAAoB,KAAOL,KAAKmB,KAC1B,gBAAAnB,KAAKK,kBAAoB,KAAOL,KAAKmB,KAAO,SAC3DC,SAAUpB,KAAKC,SAAW,IAAM,KAAI,gBACrBD,KAAKC,SAAW,OAAS,QACxCW,MAAOZ,KAAKC,SAAW,oBAAsB,UAC7CoB,QAASrB,KAAKG,WAAWmB,KAAKtB,KAAMA,KAAKI,MAAOJ,KAAKK,oBAEpDL,KAAKgB,UAAY,gBAAkBP,EACnCT,KAAKgB,UAAY,gBAAkBF,EACpCJ,EAAK,OAAAC,IAAA,2CAAAC,MAAM,oBAAmBF,EAAA,QAAAC,IAAA,+C,uHA/DrB,I","ignoreList":[]}

package/dist/pine-core/p-dace69e7.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsAvatarCss","PdsAvatar","exports","class_1","hostRef","_this","this","alt","badge","dropdown","image","size","variant","renderAssetWrapper","style","height","avatarSize","width","h","part","renderIconOrImage","renderBadge","renderAvatar","class","type","color","icon","checkCircleFilled","src","userFilled","classNames","_a","concat","prototype","sizes","xs","sm","md","lg","xl","render","Host","key","id","componentId","Object","assign"],"sources":["src/components/pds-avatar/pds-avatar.scss?tag=pds-avatar&encapsulation=shadow","src/components/pds-avatar/pds-avatar.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n}\n\ndiv {\n  // These custom props are not reachable\n  --color-background-container: var(--pine-color-mercury-050);\n\n  align-items: center;\n  background-color: var(--color-background-container);\n  border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n  display: inline-flex;\n  justify-content: center;\n  position: relative;\n\n  :host(.pds-avatar--admin) & {\n    --border-radius-admin-round: var(--pine-dimension-150);\n    border-radius: var(--border-radius-admin-round);\n  }\n\n  // Remove when FF has support for :has\n  :host(.pds-avatar--has-image) & {\n    background: transparent\n  }\n\n  @supports selector(:has) {\n    &:has(img) {\n      background-color: transparent\n    }\n  }\n}\n\n.pds-avatar__button {\n  align-items: center;\n  appearance: none;\n  background: transparent;\n  border: var(--pine-dimension-none);\n  border-radius: var(--pine-border-radius-full);\n  cursor: pointer;\n  display: flex;\n  padding: var(--pine-dimension-none);\n\n  &:focus-visible {\n    outline: var(--pine-outline-focus);\n  }\n}\n\n.pds-avatar__badge {\n  background-color: var(--pine-color-background-container);\n  border: var(--pine-border);\n  border-color: var(--pine-color-secondary);\n  border-radius: var(--pine-border-radius-round);\n  inset-block-end: var(--pine-dimension-none);\n  inset-inline-end: var(--pine-dimension-none);\n  position: absolute;\n}\n\nimg {\n  border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n  height: 100%;\n  object-fit: cover;\n  width: 100%;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { checkCircleFilled, userFilled } from '@pine-ds/icons/icons';\n\n/**\n * @part image - The main image element that represents the avatar component.\n*/\n@Component({\n  tag: 'pds-avatar',\n  styleUrls: ['pds-avatar.scss'],\n  shadow: true,\n})\nexport class PdsAvatar {\n\n  /**\n   * The alt for a custom user image.\n   * @defaultValue null\n   */\n  @Prop() alt?: string | null = null;\n\n  /**\n   * Determines whether the badge is visible or not.\n   * @defaultValue false\n   */\n  @Prop() badge? = false;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether the avatar functions as a dropdown trigger.\n   * @defaultValue false\n   */\n  @Prop() dropdown? = false;\n\n  /**\n   * The src for a custom user image.\n   * @defaultValue null\n   */\n  @Prop() image?: string | null = null;\n\n  /**\n   * Size of the avatar. Value can be preset or custom.\n   * @defaultValue lg\n   */\n  @Prop({ reflect: true }) size?:\n  | 'xl' // 64px\n  | 'lg' // 56px\n  | 'md' // 40px\n  | 'sm' // 32px\n  | 'xs' // 24px\n  | string = 'lg';\n\n  /**\n   * Determines the variant of avatar. Changes appearance accordingly.\n   * @defaultValue customer\n   */\n  @Prop({ reflect: true }) variant?: 'customer' | 'admin' = 'customer';\n\n  private avatarSize() {\n    const sizes: { [key: string]: any } = {\n      xs: '24px',\n      sm: '32px',\n      md: '40px',\n      lg: '56px',\n      xl: '64px',\n    }\n\n    if (sizes[this.size]) {\n      return sizes[this.size];\n    } else {\n      return this.size\n    }\n  }\n\n  private renderAssetWrapper = () => {\n    const style = {\n      height: this.avatarSize(),\n      width: this.avatarSize()\n    };\n\n    return (\n      <div style={style} part=\"asset-wrapper\">\n        {this.renderIconOrImage()}\n        {this.renderBadge()}\n      </div>\n    )\n  };\n\n  private renderAvatar = () => {\n    return (\n      this.dropdown\n        ?\n        <button class=\"pds-avatar__button\" type=\"button\" aria-label=\"Avatar dropdown trigger\">\n        {this.renderAssetWrapper()}\n        </button>\n        :\n        this.renderAssetWrapper()\n    )\n  };\n\n  private renderBadge = () => (\n    this.badge\n    // Percentage is average size of icon in relation to total avatar size\n    // of all preset sizes found in Figma.\n    // Used to allow icons to scale to container size\n      && <pds-icon color=\"var(--pine-color-purple-600)\" class=\"pds-avatar__badge\" icon={checkCircleFilled} size=\"33.53%\"></pds-icon>\n  );\n\n  private renderIconOrImage = () => (\n    this.image\n      ? <img alt={this.alt} src={this.image} />\n      // Percentage is average size of icon in relation to total avatar size\n      // of all preset sizes found in Figma.\n      // Used to allow icons to scale to container size\n      : <pds-icon color=\"var(--pine-color-mercury-500)\" icon={userFilled} size=\"33.53%\"></pds-icon>\n  );\n\n  private classNames = () => (\n    {\n      'pds-avatar': true,\n      [`pds-avatar--has-image`]: this.image !== '' && this.image !== null, // Remove when FF supports :has selector\n      [`pds-avatar--${this.variant}`]: this.variant === 'admin'\n    }\n  );\n\n  render() {\n\n    return (\n      <Host\n        id={this.componentId}\n        class={{...this.classNames()}}\n      >\n        {this.renderAvatar()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"wMAAA,IAAMA,EAAe,g6C,ICWRC,EAASC,EAAA,wBALtB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,UAWUA,KAAGC,IAAmB,KAMtBD,KAAKE,MAAI,MAWTF,KAAQG,SAAI,MAMZH,KAAKI,MAAmB,KAMPJ,KAAIK,KAMlB,KAMcL,KAAOM,QAA0B,WAkBlDN,KAAkBO,mBAAG,WAC3B,IAAMC,EAAQ,CACZC,OAAQV,EAAKW,aACbC,MAAOZ,EAAKW,cAGd,OACEE,EAAA,OAAKJ,MAAOA,EAAOK,KAAK,iBACrBd,EAAKe,oBACLf,EAAKgB,cAGZ,EAEQf,KAAYgB,aAAG,WACrB,OACEjB,EAAKI,SAEHS,EAAA,UAAQK,MAAM,qBAAqBC,KAAK,SAAoB,wCAC3DnB,EAAKQ,sBAGNR,EAAKQ,oBAEX,EAEQP,KAAAe,YAAc,kBACpBhB,EAAKG,OAIAU,EAAA,YAAUO,MAAM,+BAA+BF,MAAM,oBAAoBG,KAAMC,EAAmBhB,KAAK,UALxF,EAQdL,KAAAc,kBAAoB,kBAC1Bf,EAAKK,MACDQ,EAAA,OAAKX,IAAKF,EAAKE,IAAKqB,IAAKvB,EAAKK,QAI9BQ,EAAA,YAAUO,MAAM,gCAAgCC,KAAMG,EAAYlB,KAAK,UANjD,EASpBL,KAAAwB,WAAa,W,MAAA,OAAAC,EAAA,CAEjB,aAAc,MACdA,EAAC,yBAA0B1B,EAAKK,QAAU,IAAML,EAAKK,QAAU,KAC/DqB,EAAC,eAAAC,OAAe3B,EAAKO,UAAYP,EAAKO,UAAY,Q,CAJjC,CAmBtB,CA9EST,EAAA8B,UAAAjB,WAAA,WACN,IAAMkB,EAAgC,CACpCC,GAAI,OACJC,GAAI,OACJC,GAAI,OACJC,GAAI,OACJC,GAAI,QAGN,GAAIL,EAAM5B,KAAKK,MAAO,CACpB,OAAOuB,EAAM5B,KAAKK,K,KACb,CACL,OAAOL,KAAKK,I,GAuDhBR,EAAA8B,UAAAO,OAAA,WAEE,OACEtB,EAACuB,EAAI,CAAAC,IAAA,2CACHC,GAAIrC,KAAKsC,YACTrB,MAAKsB,OAAAC,OAAA,GAAMxC,KAAKwB,eAEfxB,KAAKgB,e,WA3HQ,I","ignoreList":[]}

package/dist/pine-core/p-db12273e.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsImageCss","PdsImage","exports","class_1","hostRef","this","alt","loading","prototype","render","h","Host","key","class","id","componentId","height","sizes","src","srcset","width"],"sources":["src/components/pds-image/pds-image.scss?tag=pds-image&encapsulation=shadow","src/components/pds-image/pds-image.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --dimension-aspect-ratio: The image's aspect ratio.\n  */\n\n  --dimension-aspect-ratio: auto;\n  display: inline-block;\n}\n\nimg {\n  aspect-ratio: var(--dimension-aspect-ratio);\n  display: block;\n  height: auto;\n  max-width: 100%;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'pds-image',\n  styleUrls: ['pds-image.scss'],\n  shadow: true,\n})\nexport class PdsImage {\n  /**\n   * The image's alt tag. If none is provided,\n   * it will default to an empty string, which is desired for\n   * decorative images.\n   * @defaultValue ''\n   */\n  @Prop() alt? = '';\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * The height of the image in pixels. Setting this will\n   * devote space in the layout to prevent layout\n   * shifts when the image is loaded.\n   */\n  @Prop() height?: number;\n\n  /**\n   * Indicates how the browser should load the image.\n   * @defaultValue eager\n   */\n  @Prop() loading?: 'eager' | 'lazy' = 'eager';\n\n  /**\n   * Determines the intended display size of an image\n   * within certain breakpoints. Has no effect if `srcset`\n   * is not set or value has no width descriptor.\n   */\n  @Prop() sizes?: string;\n\n  /**\n   * The image's source.\n   */\n  @Prop() src: string;\n\n  /**\n   * A set of image sources for the browser to use\n   * for responsiveness.\n   */\n  @Prop() srcset?: string\n\n  /**\n   * The width of the image in pixels. Setting this will\n   * devote space in the layout to prevent layout\n   * shifts when the image is loaded.\n   */\n  @Prop() width?: number;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'pds-image': true,\n        }}\n        id={this.componentId}\n      >\n        <img\n          alt={this.alt}\n          height={this.height}\n          loading={this.loading}\n          sizes={this.sizes}\n          src={this.src}\n          srcset={this.srcset}\n          width={this.width}\n        />\n      </Host>\n    );\n  }\n}\n"],"mappings":"kJAAA,IAAMA,EAAc,oJ,ICOPC,EAAQC,EAAA,uBALrB,SAAAC,EAAAC,G,UAYUC,KAAGC,IAAI,GAkBPD,KAAOE,QAAsB,OA+CtC,CApBCJ,EAAAK,UAAAC,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,YAAa,MAEfC,GAAIT,KAAKU,aAETL,EACE,OAAAE,IAAA,2CAAAN,IAAKD,KAAKC,IACVU,OAAQX,KAAKW,OACbT,QAASF,KAAKE,QACdU,MAAOZ,KAAKY,MACZC,IAAKb,KAAKa,IACVC,OAAQd,KAAKc,OACbC,MAAOf,KAAKe,Q,WAnED,I","ignoreList":[]}

package/dist/pine-core/p-e18c3044.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTooltipCss","PdsTooltip","constructor","hostRef","this","_isInteractiveOpen","portalEl","resolvedPlacement","triggerEl","contentDiv","slotMutationObserver","currentPathname","pathnameCheckInterval","stopAutoUpdate","hasArrow","htmlContent","placement","maxWidth","opened","handleHide","hideTooltip","handleShow","showTooltip","handlePageShow","handleSpaNavigation","checkPathnameChange","window","location","pathname","handleOpenToggle","newValue","oldValue","componentWillLoad","componentDidLoad","addEventListener","el","querySelector","contentSlotWrapper","MutationObserver","removePortal","createPortal","observe","childList","subtree","disconnectedCallback","removeEventListener","disconnect","clearInterval","componentDidRender","className","setAttribute","determinePositioningAnchor","positioningAnchor","children","childNodes","i","length","childNode","nodeType","Node","ELEMENT_NODE","repositionPortal","anchor","x","y","computedPlacement","computePosition","strategy","middleware","offset","flip","shift","padding","Object","assign","style","left","top","position","error","console","warn","anchorRect","getBoundingClientRect","right","document","createElement","zIndex","id","suffix","instanceCounter","baseId","componentId","getAttribute","slottedContentContainer","hasSlottedContent","childrenToClone","Array","from","hasMeaningfulNode","some","node","TEXT_NODE","_a","textContent","trim","forEach","appendChild","cloneNode","content","body","catch","autoUpdate","setInterval","parentNode","removeChild","removeAttribute","render","hostId","undefined","h","Host","key","class","onMouseEnter","onMouseLeave","onFocusin","onFocusout","ref","hidden","name"],"sources":["src/components/pds-tooltip/pds-tooltip.scss?tag=pds-tooltip","src/components/pds-tooltip/pds-tooltip.tsx"],"sourcesContent":[".pds-tooltip {\n  --tooltip-border-width-arrow-down: var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;\n  --tooltip-border-width-arrow-left: var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;\n  --tooltip-border-width-arrow-right: var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);\n  --tooltip-border-width-arrow-up: 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);\n  --tooltip-sizing-arrow: 6px;\n  --tooltip-sizing-arrow-offset: 14px;\n  --tooltip-dimension-max-width: 320px;\n}\n\n.pds-tooltip__content {\n  background-color: var(--pine-color-primary);\n  border-radius: calc(var(--pine-dimension-xs) * 1.25);\n  box-shadow: var(--pine-box-shadow);\n  color: var(--pine-color-text-primary);\n  // TODO: need to use block / none but the tooltip content width and height are needed for calculations\n  max-width: var(--tooltip-dimension-max-width);\n  opacity: 0;\n  padding: var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);\n  visibility: hidden;\n  width: max-content;\n\n  .pds-tooltip--is-open & {\n    // TODO: need to use block / none but the tooltip content width and height are needed for calculations\n    opacity: 1;\n    visibility: visible;\n    z-index: var(--pine-z-index-raised);\n  }\n\n  .pds-tooltip.pds-tooltip--has-html-content & {\n    width: auto;\n  }\n\n  &::after {\n    border-color: transparent;\n    border-right-color: transparent;\n    border-style: solid;\n    border-width: var(--tooltip-border-width-arrow-left);\n    content: '';\n    height: 0;\n    position: absolute;\n    width: 0;\n\n    .pds-tooltip--right & {\n      border-inline-end-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-left);\n      left: calc(var(--tooltip-sizing-arrow) * -1);\n      top: 50%;\n      transform: translateY(-50%);\n    }\n\n    .pds-tooltip--right-end & {\n      border-inline-end-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-left);\n      bottom: var(--tooltip-sizing-arrow-offset);\n      left: calc(var(--tooltip-sizing-arrow) * -1);\n      top: initial;\n    }\n\n    .pds-tooltip--right-start & {\n      border-inline-end-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-left);\n      left: calc(var(--tooltip-sizing-arrow) * -1);\n      top: var(--tooltip-sizing-arrow-offset);\n    }\n\n    .pds-tooltip--top & {\n      border-block-start-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-down);\n      bottom: calc(var(--tooltip-sizing-arrow) * -1);\n      left: 50%;\n      top: initial;\n      transform: translateX(-50%);\n    }\n\n    .pds-tooltip--top-start & {\n      border-block-start-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-down);\n      bottom: calc(var(--tooltip-sizing-arrow) * -1);\n      left: var(--tooltip-sizing-arrow-offset);\n      top: initial;\n    }\n\n    .pds-tooltip--top-end & {\n      border-block-start-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-down);\n      bottom: calc(var(--tooltip-sizing-arrow) * -1);\n      left: initial;\n      right: var(--tooltip-sizing-arrow-offset);\n      top: initial;\n    }\n\n    .pds-tooltip--left & {\n      border-inline-start-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-right);\n      left: initial;\n      right: calc(var(--tooltip-sizing-arrow) * -1);\n      top: 50%;\n      transform: translateY(-50%);\n    }\n\n    .pds-tooltip--left-end & {\n      border-inline-start-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-right);\n      bottom: var(--tooltip-sizing-arrow-offset);\n      left: initial;\n      right: calc(var(--tooltip-sizing-arrow) * -1);\n      top: initial;\n    }\n\n    .pds-tooltip--left-start & {\n      border-inline-start-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-right);\n      left: initial;\n      right: calc(var(--tooltip-sizing-arrow) * -1);\n      top: var(--tooltip-sizing-arrow-offset);\n    }\n\n    .pds-tooltip--bottom & {\n      border-block-end-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-up);\n      left: 50%;\n      top: calc(var(--tooltip-sizing-arrow) * -1);\n      transform: translateX(-50%);\n    }\n\n    .pds-tooltip--bottom-end & {\n      border-block-end-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-up);\n      left: initial;\n      right: var(--tooltip-sizing-arrow-offset);\n      top: calc(var(--tooltip-sizing-arrow) * -1);\n    }\n\n    .pds-tooltip--bottom-start & {\n      border-block-end-color: var(--pine-color-primary);\n      border-width: var(--tooltip-border-width-arrow-up);\n      left: var(--tooltip-sizing-arrow-offset);\n      top: calc(var(--tooltip-sizing-arrow) * -1);\n    }\n\n    .pds-tooltip--no-arrow & {\n      border-width: 0;\n    }\n  }\n}\n","import { Component, Element, Host, Prop, State, h, Method, Watch } from '@stencil/core';\nimport { PlacementType } from '@utils/types';\nimport {\n  autoUpdate,\n  computePosition,\n  flip,\n  offset,\n  shift,\n} from '@floating-ui/dom';\n\n/**\n * @slot (default) - The tooltip's target element\n * @slot content - HTML content for the tooltip\n */\n\n@Component({\n  tag: 'pds-tooltip',\n  styleUrls: ['pds-tooltip.scss'],\n  shadow: false,\n})\n\nexport class PdsTooltip {\n  private static instanceCounter = 0;\n\n  /**\n   * Internal state: true if the tooltip was opened by user interaction (hover/focus),\n   * false if opened via the `opened` prop or currently closed.\n   */\n  @State() private _isInteractiveOpen = false;\n\n  private portalEl: HTMLElement | null = null;\n  private resolvedPlacement: PlacementType = 'right';\n  private triggerEl: HTMLElement | null = null;\n  private contentDiv: HTMLElement | null = null;\n  private slotMutationObserver: MutationObserver | null = null;\n  private currentPathname: string = '';\n  private pathnameCheckInterval: ReturnType<typeof setInterval> | null = null;\n  private stopAutoUpdate: (() => void) | null = null;\n\n  /**\n   * Reference to the Host element\n   */\n  @Element() el: HTMLPdsTooltipElement;\n\n  /**\n   * Content for the tooltip. If HTML is required, use the content slot\n   */\n  @Prop() content: string;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether or not the tooltip has an arrow\n   * @defaultValue true\n   */\n  @Prop() hasArrow = true;\n\n  /**\n   * Enable this option when using the content slot\n   * @defaultValue false\n   */\n  @Prop() htmlContent = false;\n\n  /**\n   * Determines the preferred position of the tooltip\n   * @defaultValue \"right\"\n   */\n  @Prop({ reflect: true }) placement: PlacementType = 'right';\n\n  /**\n   * Sets the maximum width of the tooltip content\n   * @defaultValue \"352px\"\n   */\n  @Prop() maxWidth: string = '352px';\n\n  /**\n   * Determines whether or not the tooltip is visible\n   * @defaultValue false\n   */\n  @Prop({mutable: true, reflect: true}) opened = false;\n\n  @Watch('opened')\n\n  handleOpenToggle(newValue: boolean, oldValue: boolean) {\n    if (newValue === false && oldValue === true) {\n      this._isInteractiveOpen = false;\n    }\n  }\n\n  componentWillLoad() {\n    this._isInteractiveOpen = false;\n    this.resolvedPlacement = this.placement;\n  }\n\n  componentDidLoad() {\n    window.addEventListener('pageshow', this.handlePageShow);\n    this.currentPathname = window.location.pathname;\n    this.triggerEl = this.el.querySelector('.pds-tooltip__trigger') as HTMLElement;\n    const contentSlotWrapper = this.el.querySelector('.pds-tooltip__content-slot-wrapper');\n\n    if (contentSlotWrapper !== null) {\n      this.slotMutationObserver = new MutationObserver(() => {\n        if (this.opened && this.portalEl !== null) {\n          this.removePortal();\n          this.createPortal();\n        }\n      });\n      this.slotMutationObserver.observe(contentSlotWrapper, { childList: true, subtree: false });\n    }\n\n    // no return; Stencil ignores teardown functions here\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener('pageshow', this.handlePageShow);\n    if (this.slotMutationObserver !== null) {\n      this.slotMutationObserver.disconnect();\n      this.slotMutationObserver = null;\n    }\n    // Ensure global listeners/intervals are removed if still present\n    if (this.portalEl !== null) {\n      this.removePortal();\n    }\n    if (this.pathnameCheckInterval !== null) {\n      clearInterval(this.pathnameCheckInterval);\n      this.pathnameCheckInterval = null;\n    }\n    // Ensure autoUpdate is stopped if still present\n    if (this.stopAutoUpdate !== null) {\n      this.stopAutoUpdate();\n      this.stopAutoUpdate = null;\n    }\n  }\n\n  componentDidRender() {\n    if (this.opened && this.portalEl === null) {\n      this.createPortal();\n    } else if (!this.opened && this.portalEl !== null) {\n      this.removePortal();\n    }\n\n    // Update portal class when opened state changes\n    if (this.portalEl !== null) {\n      this.portalEl.className = `pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent ? 'pds-tooltip--has-html-content' : ''} ${this.opened ? 'pds-tooltip--is-open' : ''} ${this.hasArrow ? '' : 'pds-tooltip--no-arrow'}`;\n\n      // Update ARIA attributes to stay in sync with visual open state\n      this.portalEl.setAttribute('aria-hidden', this.opened ? 'false' : 'true');\n      this.portalEl.setAttribute('aria-live', this.opened ? 'polite' : 'off');\n    }\n  }\n\n  /**\n   * Shows the tooltip by enabling the opened property\n   */\n  @Method()\n  async showTooltip() {\n    this.opened = true;\n  }\n\n  /**\n   * Hides the tooltip by disabling the opened property\n   */\n  @Method()\n  async hideTooltip() {\n    this.opened = false;\n  }\n\n  private handleHide = () => {\n    if (this.opened && !this._isInteractiveOpen) {\n      return;\n    }\n\n    this.hideTooltip();\n    this._isInteractiveOpen = false;\n  };\n\n  private handleShow = () => {\n    if (this.opened && !this._isInteractiveOpen) {\n      return;\n    }\n\n    this._isInteractiveOpen = true;\n    this.showTooltip();\n  };\n\n  private handlePageShow = () => {\n    if (this.opened && !this._isInteractiveOpen) {\n      return;\n    }\n\n    this.opened = false;\n    this._isInteractiveOpen = false;\n  };\n\n\n  private handleSpaNavigation = () => {\n    if (this.opened && !this._isInteractiveOpen) {\n      return;\n    }\n\n    this.hideTooltip();\n    this._isInteractiveOpen = false;\n  };\n\n  private checkPathnameChange = () => {\n    if (window.location.pathname !== this.currentPathname) {\n      this.currentPathname = window.location.pathname;\n      this.handleSpaNavigation();\n    }\n  };\n\n  /**\n   * Determines the most accurate HTML element to use as the anchor for positioning the tooltip.\n   * If `htmlContent` is false, it attempts to find the actual element slotted as the trigger.\n   * Otherwise, or if no specific element is found, it defaults to the span wrapper around the trigger slot.\n   * This helps with precise alignment.\n   */\n  private determinePositioningAnchor(): HTMLElement | null {\n    let positioningAnchor: HTMLElement | null = this.triggerEl;\n\n    if (this.triggerEl !== null) {\n      const children = this.triggerEl.childNodes;\n\n      for (let i = 0; i < children.length; i++) {\n        const childNode = children[i];\n\n        if (childNode.nodeType === Node.ELEMENT_NODE) {\n          positioningAnchor = childNode as HTMLElement;\n          break; // Found the first element, use it as the anchor\n        }\n      }\n    }\n\n    // If no ELEMENT_NODE is found within this.triggerEl (e.g., if trigger is just text),\n    // positioningAnchor will correctly remain this.triggerEl (the span).\n    return positioningAnchor;\n  }\n\n  /**\n   * Centralized method to calculate and apply the tooltip's position using floating UI.\n   * Uses the determined anchor element and applies computePosition with flip, offset, and shift.\n   */\n  private async repositionPortal() {\n    const anchor = this.determinePositioningAnchor();\n\n    if (anchor !== null && this.portalEl !== null) {\n      try {\n        const { x, y, placement: computedPlacement } = await computePosition(anchor, this.portalEl, {\n          placement: this.placement,\n          strategy: 'fixed',\n          middleware: [offset(8), flip(), shift({ padding: 5 })],\n        });\n\n        this.resolvedPlacement = computedPlacement as PlacementType;\n\n        Object.assign(this.portalEl.style, {\n          left: `${x}px`,\n          top: `${y}px`,\n          position: 'fixed',\n        });\n\n        // Update CSS classes to match the resolved placement\n        this.portalEl.className = `pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent ? 'pds-tooltip--has-html-content' : ''} ${this.opened ? 'pds-tooltip--is-open' : ''} ${this.hasArrow ? '' : 'pds-tooltip--no-arrow'}`;\n      } catch (error) {\n        console.warn('Failed to position tooltip:', error);\n        this.resolvedPlacement = this.placement; // Fallback to requested placement\n        // Fallback to basic positioning if floating UI fails\n        const anchorRect = anchor.getBoundingClientRect();\n        this.portalEl.style.left = `${anchorRect.right + 8}px`;\n        this.portalEl.style.top = `${anchorRect.top}px`;\n        this.portalEl.style.position = 'fixed';\n      }\n    }\n  }\n\n  private createPortal() {\n    if (this.portalEl !== null) return;\n\n    this.portalEl = document.createElement('div');\n    this.portalEl.className = `pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent ? 'pds-tooltip--has-html-content' : ''} ${this.opened ? 'pds-tooltip--is-open' : ''} ${this.hasArrow ? '' : 'pds-tooltip--no-arrow'}`;\n    this.portalEl.style.position = 'fixed';\n    this.portalEl.style.zIndex = 'var(--pine-z-index-nuclear)';\n\n    if (this.portalEl.id === '') {\n      const suffix = PdsTooltip.instanceCounter++;\n      const baseId = this.componentId || this.el.id || 'pds-tooltip';\n      this.portalEl.id = `${baseId}-portal-${suffix}`;\n    }\n\n    if (this.portalEl.getAttribute('id') !== this.portalEl.id) {\n      this.portalEl.setAttribute('id', this.portalEl.id);\n    }\n\n    this.portalEl.setAttribute('role', 'tooltip');\n    this.portalEl.setAttribute('aria-hidden', this.opened ? 'false' : 'true');\n    this.portalEl.setAttribute('aria-live', this.opened ? 'polite' : 'off');\n    this.portalEl.style.maxWidth = this.maxWidth;\n\n    this.contentDiv = document.createElement('div');\n    this.contentDiv.className = 'pds-tooltip__content';\n    this.contentDiv.setAttribute('aria-hidden', this.opened ? 'false' : 'true');\n    this.contentDiv.setAttribute('aria-live', this.opened ? 'polite' : 'off');\n\n    const contentSlotWrapper = this.el.querySelector('.pds-tooltip__content-slot-wrapper');\n    const slottedContentContainer = contentSlotWrapper?.querySelector('[slot=\"content\"]') as HTMLElement | null;\n    let hasSlottedContent = false;\n\n    if (slottedContentContainer !== null) {\n      const childrenToClone = Array.from(slottedContentContainer.childNodes);\n\n      if (childrenToClone.length > 0) {\n        const hasMeaningfulNode = childrenToClone.some(node =>\n          node.nodeType === Node.ELEMENT_NODE ||\n          (node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== '')\n        );\n\n        if (hasMeaningfulNode) {\n          hasSlottedContent = true;\n          childrenToClone.forEach((node /*, index*/) => {\n            if (node.nodeType === Node.ELEMENT_NODE || (node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== '')) {\n              this.contentDiv.appendChild(node.cloneNode(true));\n            }\n          });\n        }\n      }\n    }\n\n    if (!hasSlottedContent && typeof this.content === 'string' && this.content.trim() !== '') {\n      this.contentDiv.textContent = this.content;\n    }\n\n    this.portalEl.appendChild(this.contentDiv);\n    document.body.appendChild(this.portalEl);\n\n    this.repositionPortal().catch(error => {\n      console.warn('Failed to position tooltip on creation:', error);\n    });\n\n    // Use Floating UI's autoUpdate to handle scroll/resize automatically\n    if (this.triggerEl && this.portalEl) {\n      this.stopAutoUpdate = autoUpdate(\n        this.triggerEl,\n        this.portalEl,\n        () => {\n          this.repositionPortal().catch(error => {\n            console.warn('Failed to reposition tooltip on auto update:', error);\n          });\n        }\n      );\n    }\n\n    // Keep only SPA navigation listeners (not handled by autoUpdate)\n    window.addEventListener('popstate', this.handleSpaNavigation, true);\n    window.addEventListener('hashchange', this.handleSpaNavigation, true);\n\n    // Start pathname change detection\n    this.pathnameCheckInterval = setInterval(this.checkPathnameChange, 100);\n\n    // Add ARIA attribute to trigger, now that portalEl and its ID are confirmed\n    if (this.triggerEl !== null && this.portalEl.id !== '') {\n      this.triggerEl.setAttribute('aria-describedby', this.portalEl.id);\n    }\n  }\n\n  private removePortal() {\n    // Stop Floating UI's autoUpdate\n    if (this.stopAutoUpdate !== null) {\n      this.stopAutoUpdate();\n      this.stopAutoUpdate = null;\n    }\n\n    // Stop pathname change detection\n    if (this.pathnameCheckInterval !== null) {\n      clearInterval(this.pathnameCheckInterval);\n      this.pathnameCheckInterval = null;\n    }\n\n    if (this.portalEl !== null) {\n      // Remove only SPA navigation listeners (scroll/resize handled by autoUpdate)\n      window.removeEventListener('popstate', this.handleSpaNavigation, true);\n      window.removeEventListener('hashchange', this.handleSpaNavigation, true);\n\n      // Safely remove portal from DOM\n      try {\n        if (this.portalEl.parentNode) {\n          this.portalEl.parentNode.removeChild(this.portalEl);\n        }\n      } catch (error) {\n        // Portal might have already been removed by test cleanup\n        console.warn('Portal element could not be removed from DOM:', error);\n      }\n\n      this.portalEl = null;\n    }\n\n    // Remove ARIA attribute from trigger\n    if (this.triggerEl !== null) {\n      this.triggerEl.removeAttribute('aria-describedby');\n    }\n    this.contentDiv = null;\n  }\n\n  render() {\n    const hostId = this.componentId || undefined;\n\n    return (\n      <Host id={hostId} class={{ 'pds-tooltip--is-open': this.opened }}>\n        <span\n          class=\"pds-tooltip__trigger\"\n          onMouseEnter={this.handleShow}\n          onMouseLeave={this.handleHide}\n          /* focusin/out bubble; ensure keyboard users see tooltips */\n          onFocusin={this.handleShow as any}\n          onFocusout={this.handleHide as any}\n          ref={el => this.triggerEl = el}\n        >\n          <slot />\n        </span>\n        <div class=\"pds-tooltip__content-slot-wrapper\" hidden>\n          <slot name=\"content\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pine-core/p-e6085566.system.entry.js

@@ -1,2 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(t,e,n,o){function i(t){return t instanceof n?t:new n((function(e){e(t)}))}return new(n||(n=Promise))((function(n,s){function r(t){try{p(o.next(t))}catch(t){s(t)}}function d(t){try{p(o["throw"](t))}catch(t){s(t)}}function p(t){t.done?n(t.value):i(t.value).then(r,d)}p((o=o.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var n={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},o,i,s,r;return r={next:d(0),throw:d(1),return:d(2)},typeof Symbol==="function"&&(r[Symbol.iterator]=function(){return this}),r;function d(t){return function(e){return p([t,e])}}function p(d){if(o)throw new TypeError("Generator is already executing.");while(r&&(r=0,d[0]&&(n=0)),n)try{if(o=1,i&&(s=d[0]&2?i["return"]:d[0]?i["throw"]||((s=i["return"])&&s.call(i),0):i.next)&&!(s=s.call(i,d[1])).done)return s;if(i=0,s)d=[d[0]&2,s.value];switch(d[0]){case 0:case 1:s=d;break;case 4:n.label++;return{value:d[1],done:false};case 5:n.label++;i=d[1];d=[0];continue;case 7:d=n.ops.pop();n.trys.pop();continue;default:if(!(s=n.trys,s=s.length>0&&s[s.length-1])&&(d[0]===6||d[0]===2)){n=0;continue}if(d[0]===3&&(!s||d[1]>s[0]&&d[1]<s[3])){n.label=d[1];break}if(d[0]===6&&n.label<s[1]){n.label=s[1];s=d;break}if(s&&n.label<s[2]){n.label=s[2];n.ops.push(d);break}if(s[2])n.ops.pop();n.trys.pop();continue}d=e.call(t,n)}catch(t){d=[6,t];i=0}finally{o=s=0}if(d[0]&5)throw d[1];return{value:d[0]?d[1]:void 0,done:true}}};System.register(["./p-Cxvdulqq.system.js","./p-BG99uNIQ.system.js"],(function(t){"use strict";var e,n,o,i,s;return{setters:[function(t){e=t.r;n=t.c;o=t.h;i=t.H},function(t){s=t.a}],execute:function(){var r=":host(.pds-copytext){--copytext-color-background-hover:var(--pine-color-grey-200)}:host(.pds-copytext) pds-button{-ms-flex-align:center;align-items:center;background:var(--pine-color-secondary);border-radius:var(--pine-border-radius-full);border-width:var(--pine-dimension-none);display:-ms-inline-flexbox;display:inline-flex;font-family:var(--pine-font-family-heading);font-size:var(--pine-font-size-body-md);font-weight:var(--pine-font-weight-body-medium);letter-spacing:var(--pine-letter-spacing);line-height:var(--pine-line-height-body);max-width:100%}:host(.pds-copytext) pds-button::part(button){padding-block:var(--pine-dimension-2xs);padding-inline:var(--pine-dimension-xs)}:host(.pds-copytext) pds-button::part(button):hover{background-color:var(--copytext-color-background-hover);color:var(--pine-color-text-secondary-hover)}:host(.pds-copytext) pds-button span{font-weight:var(--pine-font-weight-medium);-webkit-margin-end:var(--pine-dimension-xs);margin-inline-end:var(--pine-dimension-xs);white-space:nowrap}:host(.pds-copytext) pds-button :nth-child(2){-ms-flex-negative:0;flex-shrink:0}:host(.pds-copytext):host(.pds-copytext--bordered){border-width:var(--pine-dimension-none);padding:var(--pine-dimension-none)}:host(.pds-copytext):host(.pds-copytext--bordered) pds-button{padding:var(--pine-dimension-none)}:host(.pds-copytext):host(.pds-copytext--bordered) pds-button::part(button){padding:var(--pine-dimension-none)}:host(.pds-copytext):host(.pds-copytext--bordered) pds-button::part(button):hover{background-color:transparent}:host(.pds-copytext):host(.pds-copytext--bordered) span{border:var(--pine-border);border-radius:var(--pine-border-radius-full);-webkit-margin-end:var(--pine-dimension-sm);margin-inline-end:var(--pine-dimension-sm);padding-block:var(--pine-dimension-xs);padding-inline:var(--pine-dimension-sm)}:host(.pds-copytext):host(.pds-copytext--bordered) :hover span{border:var(--pine-border-hover)}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button,:host(.pds-copytext):host(.pds-copytext--truncated) pds-button{display:-ms-inline-flexbox;display:inline-flex;min-width:auto;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button::part(button-content),:host(.pds-copytext):host(.pds-copytext--full-width) pds-button::part(button-text),:host(.pds-copytext):host(.pds-copytext--truncated) pds-button::part(button-content),:host(.pds-copytext):host(.pds-copytext--truncated) pds-button::part(button-text){-ms-flex-negative:1;flex-shrink:1;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button span,:host(.pds-copytext):host(.pds-copytext--truncated) pds-button span{text-align:start;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button{-ms-flex-pack:justify;justify-content:space-between}:host(.pds-copytext):host(.pds-copytext--truncated) pds-button span{overflow:hidden;text-overflow:ellipsis}";var d=t("pds_copytext",function(){function t(t){var o=this;e(this,t);this.pdsCopyTextClick=n(this,"pdsCopyTextClick");this.border=true;this.fullWidth=false;this.truncate=false;this.copyToClipboard=function(t){return __awaiter(o,void 0,void 0,(function(){var e;return __generator(this,(function(n){switch(n.label){case 0:n.trys.push([0,3,,4]);if(!(typeof navigator.clipboard!=="undefined"))return[3,2];return[4,navigator.clipboard.writeText(t)];case 1:n.sent();this.pdsCopyTextClick.emit("Copied to clipboard");n.label=2;case 2:return[3,4];case 3:e=n.sent();this.pdsCopyTextClick.emit("Error writing text to clipboard: ".concat(e));return[3,4];case 4:return[2]}}))}))};this.handleClick=function(){o.copyToClipboard(o.value)}}t.prototype.classNames=function(){var t=["pds-copytext"];if(this.border){t.push("pds-copytext--bordered")}if(this.fullWidth){t.push("pds-copytext--full-width")}if(this.truncate){t.push("pds-copytext--truncated")}return t.join(" ")};t.prototype.render=function(){return o(i,{key:"4e2807a9779817005eb3278473be655d7115923b",class:this.classNames(),id:this.componentId},o("pds-button",{key:"5a1ca42426b7c11e3bbc7667d42ba3aba8d9cc7d",type:"button",variant:"unstyled",onClick:this.handleClick},o("span",{key:"5d6be503f6a31e07af483134b4c3a5f8699f43c3"},this.value),o("pds-icon",{key:"6e1ad7232addedf1d34ed6a3fa1c8ddc11000ef3",icon:s,size:"16px"})))};return t}());d.style=r}}}));
-//# sourceMappingURL=p-e6085566.system.entry.js.map

package/dist/pine-core/p-e6085566.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsCopytextCss","PdsCopytext","exports","class_1","hostRef","_this","this","border","fullWidth","truncate","copyToClipboard","value","__awaiter","navigator","clipboard","writeText","_a","sent","pdsCopyTextClick","emit","concat","err_1","handleClick","prototype","classNames","push","join","render","h","Host","key","class","id","componentId","type","variant","onClick","icon","copyIcon","size"],"sources":["src/components/pds-copytext/pds-copytext.scss?tag=pds-copytext&encapsulation=shadow","src/components/pds-copytext/pds-copytext.tsx"],"sourcesContent":[":host(.pds-copytext) {\n  // Update custom prop usage in Button before changing\n  --copytext-color-background-hover: var(--pine-color-grey-200);\n\n\n  pds-button {\n    align-items: center;\n    background: var(--pine-color-secondary);\n    border-radius: var(--pine-border-radius-full);\n    border-width: var(--pine-dimension-none);\n    display: inline-flex;\n    font-family: var(--pine-font-family-heading);\n    font-size: var(--pine-font-size-body-md);\n    font-weight: var(--pine-font-weight-body-medium);\n    letter-spacing: var(--pine-letter-spacing);\n    line-height: var(--pine-line-height-body);\n    max-width: 100%;\n\n    &::part(button) {\n      padding-block: var(--pine-dimension-2xs);\n      padding-inline: var(--pine-dimension-xs);\n    }\n\n    &::part(button):hover {\n      // Update custom prop usage in Button before changing\n      background-color: var(--copytext-color-background-hover);\n      color: var(--pine-color-text-secondary-hover);\n    }\n\n    span {\n      font-weight: var(--pine-font-weight-medium);\n      margin-inline-end: var(--pine-dimension-xs);\n      white-space: nowrap;\n    }\n\n    :nth-child(2) {\n      flex-shrink: 0;\n    }\n  }\n\n  // bordered\n\n  &:host(.pds-copytext--bordered) {\n    border-width: var(--pine-dimension-none);\n    padding: var(--pine-dimension-none);\n\n    pds-button {\n      padding: var(--pine-dimension-none);\n\n      &::part(button) {\n        padding: var(--pine-dimension-none);\n      }\n\n      &::part(button):hover {\n        background-color: transparent;\n      }\n    }\n\n    span {\n      border: var(--pine-border);\n      border-radius: var(--pine-border-radius-full);\n      margin-inline-end: var(--pine-dimension-sm);\n      padding-block: var(--pine-dimension-xs);\n      padding-inline: var(--pine-dimension-sm);\n    }\n\n    :hover {\n      span {\n        border: var(--pine-border-hover);\n      }\n    }\n  }\n\n  // full width and truncated\n  &:host(.pds-copytext--full-width),\n  &:host(.pds-copytext--truncated) {\n    pds-button {\n      display: inline-flex;\n      min-width: auto;\n      width: 100%;\n\n      &::part(button-content),\n      &::part(button-text) {\n        flex-shrink: 1;\n        width: 100%;\n      }\n\n      span {\n        text-align: start;\n        width: 100%;\n      }\n    }\n  }\n\n  // full width\n  &:host(.pds-copytext--full-width) {\n    pds-button {\n      justify-content: space-between;\n    }\n  }\n\n  // truncated\n  &:host(.pds-copytext--truncated) {\n    pds-button span {\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n}\n","import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\n\nimport { copy as copyIcon } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-copytext',\n  styleUrls: ['pds-copytext.scss'],\n  shadow: true,\n})\nexport class PdsCopytext {\n  /**\n   * Determines whether `copytext` should have a visible border.\n   * @defaultValue true\n   */\n  @Prop({ reflect: true }) border = true;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether `copytext` should expand to the full width of its container.\n   * @defaultValue false\n   */\n  @Prop() fullWidth = false;\n\n  /**\n   * Determines whether the `value` should truncate and display with an ellipsis.\n   * @defaultValue false\n   */\n  @Prop() truncate = false;\n\n  /**\n   * The string displayed that is also copied to the clipboard upon interaction.\n   */\n  @Prop() value!: string;\n\n  /**\n   * Event fired when copyText button is clicked.\n   */\n  @Event() pdsCopyTextClick: EventEmitter;\n\n  private copyToClipboard = async (value: string) => {\n    try {\n      if (typeof navigator.clipboard !== 'undefined') {\n        await navigator.clipboard.writeText(value);\n        this.pdsCopyTextClick.emit('Copied to clipboard');\n      }\n    } catch (err) {\n      this.pdsCopyTextClick.emit(`Error writing text to clipboard: ${err}`);\n    }\n  };\n\n  private handleClick = () => {\n    this.copyToClipboard(this.value);\n  };\n\n  private classNames() {\n    const classNames = ['pds-copytext'];\n\n    if (this.border) {\n      classNames.push('pds-copytext--bordered');\n    }\n\n    if (this.fullWidth) {\n      classNames.push('pds-copytext--full-width');\n    }\n\n    if (this.truncate) {\n      classNames.push('pds-copytext--truncated');\n    }\n\n    return classNames.join(' ');\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        <pds-button type=\"button\" variant=\"unstyled\" onClick={this.handleClick}>\n          <span>{this.value}</span>\n          <pds-icon icon={copyIcon} size=\"16px\"></pds-icon>\n        </pds-button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"spDAAA,IAAMA,EAAiB,01F,ICSVC,EAAWC,EAAA,0BALxB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,2DAU2BA,KAAMC,OAAG,KAW1BD,KAASE,UAAG,MAMZF,KAAQG,SAAG,MAYXH,KAAAI,gBAAkB,SAAOC,GAAa,OAAAC,UAAAP,OAAA,qB,oGAE/BQ,UAAUC,YAAc,aAA/B,YACF,SAAMD,UAAUC,UAAUC,UAAUJ,I,OAApCK,EAAAC,OACAX,KAAKY,iBAAiBC,KAAK,uB,+CAG7Bb,KAAKY,iBAAiBC,KAAK,oCAAAC,OAAoCC,I,qCAI3Df,KAAWgB,YAAG,WACpBjB,EAAKK,gBAAgBL,EAAKM,MAC5B,CA8BD,CA5BSR,EAAAoB,UAAAC,WAAA,WACN,IAAMA,EAAa,CAAC,gBAEpB,GAAIlB,KAAKC,OAAQ,CACfiB,EAAWC,KAAK,yB,CAGlB,GAAInB,KAAKE,UAAW,CAClBgB,EAAWC,KAAK,2B,CAGlB,GAAInB,KAAKG,SAAU,CACjBe,EAAWC,KAAK,0B,CAGlB,OAAOD,EAAWE,KAAK,I,EAGzBvB,EAAAoB,UAAAI,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOzB,KAAKkB,aAAcQ,GAAI1B,KAAK2B,aACvCL,EAAA,cAAAE,IAAA,2CAAYI,KAAK,SAASC,QAAQ,WAAWC,QAAS9B,KAAKgB,aACzDM,EAAO,QAAAE,IAAA,4CAAAxB,KAAKK,OACZiB,EAAU,YAAAE,IAAA,2CAAAO,KAAMC,EAAUC,KAAK,U,WAxEjB,I","ignoreList":[]}

package/dist/pine-core/p-e683e197.system.entry.js

@@ -1,2 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(e,t,i,o){function r(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,n){function a(e){try{c(o.next(e))}catch(e){n(e)}}function s(e){try{c(o["throw"](e))}catch(e){n(e)}}function c(e){e.done?i(e.value):r(e.value).then(a,s)}c((o=o.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(n[0]&1)throw n[1];return n[1]},trys:[],ops:[]},o,r,n,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(t){return c([e,t])}}function c(s){if(o)throw new TypeError("Generator is already executing.");while(a&&(a=0,s[0]&&(i=0)),i)try{if(o=1,r&&(n=s[0]&2?r["return"]:s[0]?r["throw"]||((n=r["return"])&&n.call(r),0):r.next)&&!(n=n.call(r,s[1])).done)return n;if(r=0,n)s=[s[0]&2,n.value];switch(s[0]){case 0:case 1:n=s;break;case 4:i.label++;return{value:s[1],done:false};case 5:i.label++;r=s[1];s=[0];continue;case 7:s=i.ops.pop();i.trys.pop();continue;default:if(!(n=i.trys,n=n.length>0&&n[n.length-1])&&(s[0]===6||s[0]===2)){i=0;continue}if(s[0]===3&&(!n||s[1]>n[0]&&s[1]<n[3])){i.label=s[1];break}if(s[0]===6&&i.label<n[1]){i.label=n[1];n=s;break}if(n&&i.label<n[2]){i.label=n[2];i.ops.push(s);break}if(n[2])i.ops.pop();i.trys.pop();continue}s=t.call(e,i)}catch(e){s=[6,e];r=0}finally{o=n=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-Cxvdulqq.system.js"],(function(e){"use strict";var t,i,o,r,n;return{setters:[function(e){t=e.r;i=e.c;o=e.h;r=e.H;n=e.g}],execute:function(){var a=":host{--sizing-max-width-default:352px;display:inline-block}:host [popover]{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow-200);box-shadow:var(--pine-box-shadow-200);margin:var(--pine-dimension-none);max-width:var(--sizing-max-width-default);padding:var(--pine-dimension-md);position:fixed}:host [popover]:popover-open:not(.pds-popover--positioned){visibility:hidden}:host button{-ms-flex-align:center;align-items:center;background-color:var(--pine-color-secondary);border:var(--pine-border);border-radius:var(--pine-border-radius-full);color:var(--pine-color-text-secondary);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);font-family:var(--pine-font-family-heading);letter-spacing:var(--pine-letter-spacing);min-height:40px;padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}:host button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}:host button:hover{background-color:var(--pine-color-secondary-hover)}";var s=e("pds_popover",function(){function e(e){t(this,e);this.pdsPopoverOpen=i(this,"pdsPopoverOpen");this.pdsPopoverClose=i(this,"pdsPopoverClose");this.active=false;this.isComponentMounted=true;this.popoverTargetAction="show";this.popoverType="auto";this.maxWidth=352;this.placement="right"}e.prototype.componentDidLoad=function(){var e;var t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div[popover]");if(t!=null){this.boundToggleHandler=this.handleToggle.bind(this);t.addEventListener("toggle",this.boundToggleHandler)}};e.prototype.disconnectedCallback=function(){var e;this.isComponentMounted=false;var t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div[popover]");if(t!=null&&this.boundToggleHandler!=null){t.removeEventListener("toggle",this.boundToggleHandler)}};e.prototype.show=function(){return __awaiter(this,void 0,void 0,(function(){var e,t;return __generator(this,(function(i){t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div[popover]");if(t!=null&&typeof t.showPopover==="function"){try{t.showPopover()}catch(e){console.warn("Failed to show popover:",e)}}return[2]}))}))};e.prototype.hide=function(){return __awaiter(this,void 0,void 0,(function(){var e,t;return __generator(this,(function(i){t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div[popover]");if(t!=null&&typeof t.hidePopover==="function"){try{t.hidePopover()}catch(e){console.warn("Failed to hide popover:",e)}}return[2]}))}))};e.prototype.toggle=function(){return __awaiter(this,void 0,void 0,(function(){var e,t;return __generator(this,(function(i){t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div[popover]");if(t!=null&&typeof t.togglePopover==="function"){try{t.togglePopover()}catch(e){console.warn("Failed to toggle popover:",e)}}return[2]}))}))};e.prototype.handleToggle=function(e){var t=this;var i;var o=e;var r={componentId:this.componentId,popoverType:this.popoverType,text:this.text};if(o.newState==="open"){this.active=true;var n=(i=this.el.shadowRoot)===null||i===void 0?void 0:i.querySelector("div[popover]");if(n!=null){n.classList.remove("pds-popover--positioned")}requestAnimationFrame((function(){if(!t.isComponentMounted)return;t.handlePopoverPositioning();if(n!=null){n.classList.add("pds-popover--positioned")}}));this.pdsPopoverOpen.emit(r)}else if(o.newState==="closed"){this.active=false;this.pdsPopoverClose.emit(r)}};e.prototype.handleScroll=function(){var e;var t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div[popover]");if(t!=null&&this.active===true){this.handlePopoverPositioning()}};e.prototype.handlePopoverPositioning=function(){var e=this.el.shadowRoot.querySelector(".pds-popover__trigger");var t=this.el.shadowRoot.querySelector("div[popover]");if(e==null||t==null)return;var i=e;var o=t;var r=i.getBoundingClientRect();var n=o.getBoundingClientRect();var a=0;var s=0;var c=8;switch(this.placement){case"top":a=r.top-n.height-c;s=r.left+(r.width-n.width)/2;break;case"top-start":a=r.top-n.height-c;s=r.left;break;case"top-end":a=r.top-n.height-c;s=r.right-n.width;break;case"right":a=r.top+(r.height-n.height)/2;s=r.right+c;break;case"right-start":a=r.top;s=r.right+c;break;case"right-end":a=r.bottom-n.height;s=r.right+c;break;case"bottom":a=r.bottom+c;s=r.left+(r.width-n.width)/2;break;case"bottom-start":a=r.bottom+c;s=r.left;break;case"bottom-end":a=r.bottom+c;s=r.right-n.width;break;case"left":a=r.top+(r.height-n.height)/2;s=r.left-n.width-c;break;case"left-start":a=r.top;s=r.left-n.width-c;break;case"left-end":a=r.bottom-n.height;s=r.left-n.width-c;break}o.style.top="".concat(a,"px");o.style.left="".concat(s,"px")};e.prototype.render=function(){return o(r,{key:"c3da1b2ab23b4678aeb2f7fdfe59383c1c5e6766"},o("button",{key:"d426d0c3145820c161858123cb71cdf92a6da3f6",class:"pds-popover__trigger",popoverTarget:this.componentId,popoverTargetAction:this.popoverTargetAction},this.text),o("div",{key:"aad97aedfc716085d1e7609649cc7aaeb7de7358",class:"pds-popover ".concat(this.active?"pds-popover--active":""),id:this.componentId,popover:this.popoverType,style:{maxWidth:"".concat(this.maxWidth,"px")}},o("slot",{key:"1b5dde4a0643ee6dbdf4116cc74fff8b188e498b"})))};Object.defineProperty(e.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});return e}());s.style=a}}}));
-//# sourceMappingURL=p-e683e197.system.entry.js.map

package/dist/pine-core/p-e683e197.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsPopoverCss","PdsPopover","exports","class_1","hostRef","this","active","isComponentMounted","popoverTargetAction","popoverType","maxWidth","placement","prototype","componentDidLoad","popoverEl","_a","el","shadowRoot","querySelector","boundToggleHandler","handleToggle","bind","addEventListener","disconnectedCallback","removeEventListener","show","showPopover","e","console","warn","hide","hidePopover","toggle","togglePopover","event","_this","toggleEvent","eventDetail","componentId","text","newState","popoverEl_1","classList","remove","requestAnimationFrame","handlePopoverPositioning","add","pdsPopoverOpen","emit","pdsPopoverClose","handleScroll","triggerEl","triggerElement","popoverElement","triggerRect","getBoundingClientRect","popoverRect","top","left","offset","height","width","right","bottom","style","concat","render","h","Host","key","class","popoverTarget","id","popover"],"sources":["src/components/pds-popover/pds-popover.scss?tag=pds-popover&encapsulation=shadow","src/components/pds-popover/pds-popover.tsx"],"sourcesContent":[":host {\n  --sizing-max-width-default: 352px;\n\n  display: inline-block;\n\n  [popover] {\n    background-color: var(--pine-color-background-container);\n    border: var(--pine-border);\n    border-radius: var(--pine-dimension-125);\n    box-shadow: var(--pine-box-shadow-200);\n    margin: var(--pine-dimension-none);\n    max-width: var(--sizing-max-width-default);\n    padding: var(--pine-dimension-md);\n    position: fixed;\n\n    // Hide popover initially to prevent flash before positioning\n    // stylelint-disable-next-line selector-pseudo-class-no-unknown\n    &:popover-open:not(.pds-popover--positioned) {\n      visibility: hidden;\n    }\n  }\n\n  button {\n    align-items: center;\n    background-color: var(--pine-color-secondary);\n    border: var(--pine-border);\n    border-radius: var(--pine-border-radius-full);\n    color: var(--pine-color-text-secondary);\n    display: flex;\n    font: var(--pine-typography-body-medium);\n    font-family: var(--pine-font-family-heading);\n    letter-spacing: var(--pine-letter-spacing);\n    min-height: 40px;\n    padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n    &:focus-visible {\n      outline: var(--pine-outline-focus);\n      outline-offset: var(--pine-border-width);\n    }\n\n    &:hover {\n      background-color: var(--pine-color-secondary-hover);\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, Host, Listen, h, Method, Prop, State } from '@stencil/core';\nimport { PlacementType } from '@utils/types';\nimport { PdsPopoverEventDetail, ToggleEvent } from './popover-interface';\n\n@Component({\n  tag: 'pds-popover',\n  styleUrl: 'pds-popover.scss',\n  shadow: true,\n})\nexport class PdsPopover {\n  /**\n   * Reference to the Host element\n   */\n  @Element() el: HTMLPdsPopoverElement;\n\n  /**\n   * Determines when the popover is active\n   * @defaultValue false\n   */\n  @State() active = false;\n\n  /**\n   * Bound reference to the toggle handler for proper cleanup\n   */\n  private boundToggleHandler: (event: Event) => void;\n\n  /**\n   * Tracks if the component is still mounted to prevent memory leaks\n   */\n  private isComponentMounted = true;\n\n  /**\n   * Emitted when the popover is opened\n   */\n  @Event() pdsPopoverOpen: EventEmitter<PdsPopoverEventDetail>;\n\n  /**\n   * Emitted when the popover is closed\n   */\n  @Event() pdsPopoverClose: EventEmitter<PdsPopoverEventDetail>;\n\n  /**\n   * Determines the action that triggers the popover. For manual popovers, the consumer is responsible for toggling this value.\n   * @defaultValue \"show\"\n   */\n  @Prop() popoverTargetAction: 'show' | 'toggle' | 'hide' = 'show';\n\n  /**\n   * Determines the type of popover. Auto popovers can be \"light dismissed\" by clicking outside of the popover.\n   * Manual popovers require the consumer to handle the visibility of the popover.\n   */\n  @Prop() popoverType: 'auto' | 'manual' = 'auto';\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Text that appears on the trigger element\n   */\n  @Prop() text: string;\n\n  /**\n   * Sets the maximum width of the popover content\n   * @defaultValue 352\n   */\n  @Prop() maxWidth?: number = 352;\n\n  /**\n   * Determines the preferred position of the popover\n   * @defaultValue \"right\"\n   */\n  @Prop({ reflect: true }) placement: PlacementType = 'right';\n\n  componentDidLoad() {\n    // Attach toggle event listener to the popover element\n    const popoverEl = this.el.shadowRoot?.querySelector('div[popover]');\n    if (popoverEl != null) {\n      this.boundToggleHandler = this.handleToggle.bind(this);\n      popoverEl.addEventListener('toggle', this.boundToggleHandler);\n    }\n  }\n\n  disconnectedCallback() {\n    this.isComponentMounted = false;\n\n    // Clean up event listener\n    const popoverEl = this.el.shadowRoot?.querySelector('div[popover]');\n    if (popoverEl != null && this.boundToggleHandler != null) {\n      popoverEl.removeEventListener('toggle', this.boundToggleHandler);\n    }\n  }\n\n  /**\n   * Opens the popover programmatically\n   */\n  @Method()\n  async show() {\n    const popoverEl = this.el.shadowRoot?.querySelector('div[popover]') as HTMLElement & { showPopover?: () => void } | null;\n    if (popoverEl != null && typeof popoverEl.showPopover === 'function') {\n      try {\n        popoverEl.showPopover();\n      } catch (e) {\n        // Popover might already be open\n        console.warn('Failed to show popover:', e);\n      }\n    }\n  }\n\n  /**\n   * Closes the popover programmatically\n   */\n  @Method()\n  async hide() {\n    const popoverEl = this.el.shadowRoot?.querySelector('div[popover]') as HTMLElement & { hidePopover?: () => void } | null;\n    if (popoverEl != null && typeof popoverEl.hidePopover === 'function') {\n      try {\n        popoverEl.hidePopover();\n      } catch (e) {\n        // Popover might already be closed\n        console.warn('Failed to hide popover:', e);\n      }\n    }\n  }\n\n  /**\n   * Toggles the popover open/closed state programmatically\n   */\n  @Method()\n  async toggle() {\n    const popoverEl = this.el.shadowRoot?.querySelector('div[popover]') as HTMLElement & { togglePopover?: () => void } | null;\n    if (popoverEl != null && typeof popoverEl.togglePopover === 'function') {\n      try {\n        popoverEl.togglePopover();\n      } catch (e) {\n        console.warn('Failed to toggle popover:', e);\n      }\n    }\n  }\n\n  private handleToggle(event: Event) {\n    const toggleEvent = event as ToggleEvent;\n\n    // Prepare event detail\n    const eventDetail: PdsPopoverEventDetail = {\n      componentId: this.componentId,\n      popoverType: this.popoverType,\n      text: this.text,\n    };\n\n    // Update internal state based on native popover state\n    if (toggleEvent.newState === 'open') {\n      this.active = true;\n      const popoverEl = this.el.shadowRoot?.querySelector('div[popover]');\n\n      // Remove positioned class to hide popover via CSS\n      if (popoverEl != null) {\n        popoverEl.classList.remove('pds-popover--positioned');\n      }\n\n      // Position after the browser has rendered the popover, then show it\n      requestAnimationFrame(() => {\n        // Prevent memory leak if component unmounts during animation frame\n        if (!this.isComponentMounted) return;\n\n        this.handlePopoverPositioning();\n        if (popoverEl != null) {\n          popoverEl.classList.add('pds-popover--positioned');\n        }\n      });\n      this.pdsPopoverOpen.emit(eventDetail);\n    } else if (toggleEvent.newState === 'closed') {\n      this.active = false;\n      this.pdsPopoverClose.emit(eventDetail);\n    }\n  }\n\n  @Listen('scroll', {\n    target: 'window',\n    capture: true\n  })\n  handleScroll() {\n    // Only reposition if the popover is actually open\n    const popoverEl = this.el.shadowRoot?.querySelector('div[popover]');\n    if (popoverEl != null && this.active === true) {\n      this.handlePopoverPositioning();\n    }\n  }\n\n  private handlePopoverPositioning() {\n    const triggerEl = this.el.shadowRoot.querySelector('.pds-popover__trigger');\n    const popoverEl = this.el.shadowRoot.querySelector('div[popover]');\n\n    if (triggerEl == null || popoverEl == null) return;\n\n    // Cast to HTMLElement after null check for proper typing\n    const triggerElement = triggerEl as HTMLElement;\n    const popoverElement = popoverEl as HTMLElement;\n\n    const triggerRect = triggerElement.getBoundingClientRect();\n    const popoverRect = popoverElement.getBoundingClientRect();\n\n    let top = 0;\n    let left = 0;\n    const offset = 8\n\n    switch (this.placement) {\n      case 'top':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;\n        break;\n      case 'top-start':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.left;\n        break;\n      case 'top-end':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.right - popoverRect.width;\n        break;\n      case 'right':\n        top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;\n        left = triggerRect.right + offset;\n        break;\n      case 'right-start':\n        top = triggerRect.top;\n        left = triggerRect.right + offset;\n        break;\n      case 'right-end':\n        top = triggerRect.bottom - popoverRect.height;\n        left = triggerRect.right + offset;\n        break;\n      case 'bottom':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;\n        break;\n      case 'bottom-start':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.left;\n        break;\n      case 'bottom-end':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.right - popoverRect.width;\n        break;\n      case 'left':\n        top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n      case 'left-start':\n        top = triggerRect.top;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n      case 'left-end':\n        top = triggerRect.bottom - popoverRect.height;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n    }\n\n    popoverElement.style.top = `${top}px`;\n    popoverElement.style.left = `${left}px`;\n  }\n\n  render() {\n    return (\n      <Host>\n        <button\n          class=\"pds-popover__trigger\"\n          popoverTarget={this.componentId}\n          popoverTargetAction={this.popoverTargetAction}\n        >\n          {this.text}\n        </button>\n        <div\n          class={`pds-popover ${this.active ? 'pds-popover--active' : ''}`}\n          id={this.componentId}\n          popover={this.popoverType}\n          style={{ maxWidth: `${this.maxWidth}px` }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}