@krollins/blueprint 0.2.2 → 0.3.0

package/dist/components/tabs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tabs.js","sources":["../../source/components/tabs/tabs.style.ts","../../source/components/tabs/tabs.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const tabsStyles = css`\n  /* Base styles */\n  :host {\n    display: block;\n  }\n\n  .tabs {\n    font-family: var(--bp-font-family);\n    display: flex;\n    flex-direction: column;\n  }\n\n  /* Tablist - horizontal by default */\n  .tablist {\n    display: flex;\n    flex-wrap: nowrap;\n    gap: var(--bp-spacing-xs);\n    border-bottom: var(--bp-border-width) solid var(--bp-color-border);\n    padding-bottom: var(--bp-spacing-xs);\n  }\n\n  /* Tab button base */\n  .tab {\n    /* Reset */\n    appearance: none;\n    border: none;\n    background: transparent;\n    margin: 0;\n\n    /* Layout */\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--bp-spacing-xs);\n    cursor: pointer;\n    flex-shrink: 0;\n\n    /* Typography */\n    font-family: var(--bp-font-family);\n    font-weight: var(--bp-font-weight-medium);\n    white-space: nowrap;\n\n    /* Visual */\n    color: var(--bp-color-text-muted);\n    border-radius: var(--bp-border-radius);\n    transition: all var(--bp-transition-fast);\n\n    /* Focus */\n    outline: none;\n  }\n\n  .tab__icon {\n    flex-shrink: 0;\n  }\n\n  .tab__label {\n    display: inline-block;\n  }\n\n  .tab__close {\n    /* Reset */\n    appearance: none;\n    border: none;\n    background: transparent;\n    padding: var(--bp-spacing-xs);\n    margin: calc(-1 * var(--bp-spacing-xs));\n    margin-left: var(--bp-spacing-xs);\n    cursor: pointer;\n    border-radius: var(--bp-border-radius);\n\n    /* Layout */\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--bp-spacing-lg);\n    height: var(--bp-spacing-lg);\n\n    /* Visual */\n    color: var(--bp-color-text-muted);\n    transition: all var(--bp-transition-fast);\n  }\n\n  .tab__close svg {\n    width: var(--bp-spacing-md);\n    height: var(--bp-spacing-md);\n  }\n\n  .tab__close:hover {\n    background: var(--bp-color-surface);\n    color: var(--bp-color-text);\n  }\n\n  .tab__close:active {\n    transform: scale(0.95);\n  }\n\n  /* Panels container */\n  .panels {\n    flex: 1;\n    padding: var(--bp-spacing-md);\n  }\n\n  /* Sizes */\n  .tabs--sm .tab {\n    padding: var(--bp-spacing-xs) var(--bp-spacing-sm);\n    font-size: var(--bp-font-size-sm);\n    line-height: var(--bp-line-height-tight);\n  }\n\n  .tabs--md .tab {\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n    font-size: var(--bp-font-size-base);\n    line-height: var(--bp-line-height-normal);\n  }\n\n  .tabs--lg .tab {\n    padding: var(--bp-spacing-md) var(--bp-spacing-lg);\n    font-size: var(--bp-font-size-lg);\n    line-height: var(--bp-line-height-normal);\n  }\n\n  /* Default variant */\n  .tabs--default .tab--active {\n    color: var(--bp-color-primary);\n    background: var(--bp-color-surface);\n  }\n\n  .tabs--default .tab:hover:not(.tab--disabled):not(.tab--active) {\n    color: var(--bp-color-text);\n    background: var(--bp-color-surface-subdued);\n  }\n\n  .tab:active:not(.tab--disabled) {\n    opacity: 0.8;\n  }\n\n  /* Underline variant */\n  .tabs--underline .tablist {\n    gap: var(--bp-spacing-md);\n  }\n\n  .tabs--underline .tab {\n    border-radius: 0;\n    position: relative;\n    padding-bottom: var(--bp-spacing-sm);\n    margin-bottom: calc(-1 * var(--bp-spacing-xs) - var(--bp-border-width));\n  }\n\n  .tabs--underline .tab::after {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: var(--bp-spacing-0-5);\n    background: transparent;\n    transition: background var(--bp-transition-fast);\n  }\n\n  .tabs--underline .tab--active::after {\n    background: var(--bp-color-primary);\n  }\n\n  .tabs--underline .tab--active {\n    color: var(--bp-color-primary);\n  }\n\n  .tabs--underline .tab:hover:not(.tab--disabled):not(.tab--active) {\n    color: var(--bp-color-text);\n  }\n\n  .tabs--underline .tab:hover:not(.tab--disabled):not(.tab--active)::after {\n    background: var(--bp-color-border);\n  }\n\n  /* Pills variant */\n  .tabs--pills .tablist {\n    border-bottom: none;\n    gap: var(--bp-spacing-xs);\n    padding-bottom: 0;\n    background: var(--bp-color-surface);\n    padding: var(--bp-spacing-xs);\n    border-radius: var(--bp-border-radius-large);\n  }\n\n  .tabs--pills .tab {\n    border-radius: var(--bp-border-radius);\n  }\n\n  .tabs--pills .tab--active {\n    background: var(--bp-color-background);\n    color: var(--bp-color-text);\n    box-shadow: var(--bp-shadow-sm);\n  }\n\n  .tabs--pills .tab:hover:not(.tab--disabled):not(.tab--active) {\n    color: var(--bp-color-text);\n  }\n\n  /* Placement: bottom */\n  .tabs--bottom {\n    flex-direction: column-reverse;\n  }\n\n  .tabs--bottom .tablist {\n    border-bottom: none;\n    border-top: var(--bp-border-width) solid var(--bp-color-border);\n    padding-bottom: 0;\n    padding-top: var(--bp-spacing-xs);\n  }\n\n  .tabs--bottom.tabs--underline .tab {\n    margin-bottom: 0;\n    margin-top: calc(-1 * var(--bp-spacing-xs) - var(--bp-border-width));\n    padding-bottom: var(--bp-spacing-sm);\n    padding-top: var(--bp-spacing-sm);\n  }\n\n  .tabs--bottom.tabs--underline .tab::after {\n    top: 0;\n    bottom: auto;\n  }\n\n  /* Placement: start (vertical left) */\n  .tabs--start {\n    flex-direction: row;\n  }\n\n  .tabs--start .tablist {\n    flex-direction: column;\n    border-bottom: none;\n    border-right: var(--bp-border-width) solid var(--bp-color-border);\n    padding-bottom: 0;\n    padding-right: var(--bp-spacing-xs);\n  }\n\n  .tabs--start .tab {\n    justify-content: flex-start;\n  }\n\n  .tabs--start.tabs--underline .tab {\n    margin-bottom: 0;\n    margin-right: calc(-1 * var(--bp-spacing-xs) - var(--bp-border-width));\n    padding-right: var(--bp-spacing-sm);\n  }\n\n  .tabs--start.tabs--underline .tab::after {\n    left: auto;\n    right: 0;\n    top: 0;\n    bottom: 0;\n    width: var(--bp-spacing-0-5);\n    height: auto;\n  }\n\n  /* Placement: end (vertical right) */\n  .tabs--end {\n    flex-direction: row-reverse;\n  }\n\n  .tabs--end .tablist {\n    flex-direction: column;\n    border-bottom: none;\n    border-left: var(--bp-border-width) solid var(--bp-color-border);\n    padding-bottom: 0;\n    padding-left: var(--bp-spacing-xs);\n  }\n\n  .tabs--end .tab {\n    justify-content: flex-start;\n  }\n\n  .tabs--end.tabs--underline .tab {\n    margin-bottom: 0;\n    margin-left: calc(-1 * var(--bp-spacing-xs) - var(--bp-border-width));\n    padding-left: var(--bp-spacing-sm);\n  }\n\n  .tabs--end.tabs--underline .tab::after {\n    right: auto;\n    left: 0;\n    top: 0;\n    bottom: 0;\n    width: var(--bp-spacing-0-5);\n    height: auto;\n  }\n\n  /* States */\n  .tab--disabled {\n    cursor: not-allowed;\n    opacity: var(--bp-opacity-disabled);\n    pointer-events: none;\n  }\n\n  .tabs--disabled .tab {\n    cursor: not-allowed;\n    opacity: var(--bp-opacity-disabled);\n    pointer-events: none;\n  }\n\n  .tab:focus-visible {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n  }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport {\n  customElement,\n  property,\n  state,\n  queryAssignedElements,\n} from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { tabsStyles } from './tabs.style.js';\nimport type { IconName } from '../icon/icons/icon-name.generated.js';\nimport '../icon/icon.js';\n\nexport type TabsSize = 'sm' | 'md' | 'lg';\nexport type TabsVariant = 'default' | 'pills' | 'underline';\nexport type TabsPlacement = 'top' | 'bottom' | 'start' | 'end';\n\n/**\n * Tab item interface for programmatic tab configuration\n */\nexport interface TabItem {\n  /** Unique identifier for the tab */\n  id: string;\n  /** Display label for the tab */\n  label: string;\n  /** Whether the tab is disabled */\n  disabled?: boolean;\n  /** Icon name to display before the label */\n  icon?: IconName;\n  /** Whether this tab can be closed */\n  closable?: boolean;\n}\n\n/**\n * A tabs component for organizing content into tabbed sections.\n *\n * @element bp-tabs\n *\n * @property {string} value - The ID of the currently selected tab\n * @property {TabItem[]} tabs - Array of tab items (alternative to slotted tabs)\n * @property {TabsSize} size - The size of the tabs\n * @property {TabsVariant} variant - The visual style of the tabs\n * @property {TabsPlacement} placement - Position of the tab list relative to panels\n * @property {boolean} disabled - Whether all tabs are disabled\n * @property {boolean} manual - Whether activation requires pressing Enter/Space (vs automatic on arrow)\n *\n * @slot - Default slot for bp-tab-panel elements\n * @slot tab - Slot for custom tab buttons (use with data-tab-id attribute)\n *\n * @fires bp-tab-change - Fired when the selected tab changes\n * @fires bp-tab-close - Fired when a closable tab's close button is clicked\n *\n * @csspart tabs - The main container\n * @csspart tablist - The tab button list container\n * @csspart tab - Individual tab button\n * @csspart tab-active - The currently active tab\n * @csspart tab-disabled - A disabled tab\n * @csspart panels - The panel container\n * @csspart panel - Individual panel wrapper\n */\n@customElement('bp-tabs')\nexport class BpTabs extends LitElement {\n  /**\n   * The ID of the currently selected tab\n   */\n  @property({ type: String, reflect: true }) declare value: string;\n\n  /**\n   * Array of tab items for programmatic tab configuration\n   */\n  @property({ type: Array }) declare tabs: TabItem[];\n\n  /**\n   * The size of the tabs\n   */\n  @property({ type: String, reflect: true }) declare size: TabsSize;\n\n  /**\n   * The visual style of the tabs\n   */\n  @property({ type: String, reflect: true }) declare variant: TabsVariant;\n\n  /**\n   * Position of the tab list relative to panels\n   */\n  @property({ type: String, reflect: true }) declare placement: TabsPlacement;\n\n  /**\n   * Whether all tabs are disabled\n   */\n  @property({ type: Boolean, reflect: true }) declare disabled: boolean;\n\n  /**\n   * Whether activation requires pressing Enter/Space (manual) vs automatic on arrow navigation\n   */\n  @property({ type: Boolean, reflect: true }) declare manual: boolean;\n\n  @state() private focusedTabId: string | null = null;\n\n  @queryAssignedElements({ slot: '', flatten: true })\n  private panelElements!: HTMLElement[];\n\n  static styles = [tabsStyles];\n\n  constructor() {\n    super();\n    this.value = '';\n    this.tabs = [];\n    this.size = 'md';\n    this.variant = 'default';\n    this.placement = 'top';\n    this.disabled = false;\n    this.manual = false;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.setAttribute('role', 'tablist');\n  }\n\n  updated(changedProperties: Map<string, unknown>): void {\n    super.updated(changedProperties);\n\n    if (changedProperties.has('value')) {\n      this.updatePanelVisibility();\n    }\n  }\n\n  private handleSlotChange = () => {\n    // Auto-select first tab if none selected\n    if (!this.value && this.tabs.length > 0) {\n      const firstEnabled = this.tabs.find((tab) => !tab.disabled);\n      if (firstEnabled) {\n        this.value = firstEnabled.id;\n      }\n    } else if (!this.value) {\n      // Check for panels with data-tab-id\n      const panels = this.getPanels();\n      if (panels.length > 0) {\n        this.value = panels[0].getAttribute('data-tab-id') || '';\n      }\n    }\n\n    this.updatePanelVisibility();\n  };\n\n  private getPanels(): HTMLElement[] {\n    return this.panelElements.filter(\n      (el) => el.hasAttribute('data-tab-id') || el.tagName === 'BP-TAB-PANEL'\n    );\n  }\n\n  private getEnabledTabs(): TabItem[] {\n    return this.tabs.filter((tab) => !tab.disabled);\n  }\n\n  private updatePanelVisibility() {\n    const panels = this.getPanels();\n    panels.forEach((panel) => {\n      const panelId = panel.getAttribute('data-tab-id') || '';\n      const isActive = panelId === this.value;\n      panel.hidden = !isActive;\n      panel.setAttribute('aria-hidden', String(!isActive));\n      if (isActive) {\n        panel.setAttribute('tabindex', '0');\n      } else {\n        panel.removeAttribute('tabindex');\n      }\n    });\n  }\n\n  private handleTabClick = (tabId: string, disabled: boolean) => {\n    if (disabled || this.disabled) return;\n\n    this.selectTab(tabId);\n  };\n\n  private handleTabKeyDown = (event: KeyboardEvent, tabId: string) => {\n    if (this.disabled) return;\n\n    const enabledTabs = this.getEnabledTabs();\n    const currentIndex = enabledTabs.findIndex((tab) => tab.id === tabId);\n\n    let newIndex = currentIndex;\n    let handled = false;\n\n    switch (event.key) {\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        event.preventDefault();\n        handled = true;\n        newIndex = currentIndex > 0 ? currentIndex - 1 : enabledTabs.length - 1;\n        break;\n\n      case 'ArrowRight':\n      case 'ArrowDown':\n        event.preventDefault();\n        handled = true;\n        newIndex = currentIndex < enabledTabs.length - 1 ? currentIndex + 1 : 0;\n        break;\n\n      case 'Home':\n        event.preventDefault();\n        handled = true;\n        newIndex = 0;\n        break;\n\n      case 'End':\n        event.preventDefault();\n        handled = true;\n        newIndex = enabledTabs.length - 1;\n        break;\n\n      case 'Enter':\n      case ' ':\n        if (this.manual && this.focusedTabId) {\n          event.preventDefault();\n          handled = true;\n          this.selectTab(this.focusedTabId);\n        }\n        break;\n\n      case 'Delete':\n      case 'Backspace': {\n        const tab = this.tabs.find((t) => t.id === tabId);\n        if (tab?.closable) {\n          event.preventDefault();\n          handled = true;\n          this.handleTabClose(event, tabId);\n        }\n        break;\n      }\n    }\n\n    if (handled && newIndex !== currentIndex) {\n      const newTab = enabledTabs[newIndex];\n      if (newTab) {\n        this.focusedTabId = newTab.id;\n        this.focusTab(newTab.id);\n\n        // In automatic mode, select the tab on arrow navigation\n        if (!this.manual) {\n          this.selectTab(newTab.id);\n        }\n      }\n    }\n  };\n\n  private focusTab(tabId: string) {\n    const tabButton = this.shadowRoot?.querySelector(\n      `[data-tab-id=\"${tabId}\"]`\n    ) as HTMLElement | null;\n    tabButton?.focus();\n  }\n\n  private selectTab(tabId: string) {\n    const previousValue = this.value;\n    if (previousValue === tabId) return;\n\n    this.value = tabId;\n    this.updatePanelVisibility();\n\n    this.dispatchEvent(\n      new CustomEvent('bp-tab-change', {\n        detail: {\n          value: tabId,\n          previousValue,\n        },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private handleTabClose = (event: Event, tabId: string) => {\n    event.stopPropagation();\n\n    this.dispatchEvent(\n      new CustomEvent('bp-tab-close', {\n        detail: { tabId },\n        bubbles: true,\n        composed: true,\n      })\n    );\n\n    // Remove the closed tab\n    const closedIndex = this.tabs.findIndex((t) => t.id === tabId);\n    this.tabs = this.tabs.filter((t) => t.id !== tabId);\n\n    // If the closed tab was active, activate an adjacent tab\n    if (this.value === tabId && this.tabs.length > 0) {\n      const nextIndex = Math.min(closedIndex, this.tabs.length - 1);\n      this.value = this.tabs[nextIndex].id;\n    }\n  };\n\n  private handleTabFocus = (tabId: string) => {\n    this.focusedTabId = tabId;\n  };\n\n  private handleTabBlur = () => {\n    this.focusedTabId = null;\n  };\n\n  private renderTab(tab: TabItem) {\n    const isActive = this.value === tab.id;\n    const isDisabled = tab.disabled || this.disabled;\n\n    const tabClasses = {\n      tab: true,\n      'tab--active': isActive,\n      'tab--disabled': isDisabled,\n    };\n\n    return html`\n      <button\n        class=${classMap(tabClasses)}\n        part=\"tab ${isActive ? 'tab-active' : ''} ${isDisabled\n          ? 'tab-disabled'\n          : ''}\"\n        role=\"tab\"\n        data-tab-id=${tab.id}\n        id=\"tab-${tab.id}\"\n        aria-selected=${isActive}\n        aria-controls=\"panel-${tab.id}\"\n        aria-disabled=${isDisabled}\n        tabindex=${isActive ? 0 : -1}\n        ?disabled=${isDisabled}\n        @click=${() => this.handleTabClick(tab.id, isDisabled)}\n        @keydown=${(e: KeyboardEvent) => this.handleTabKeyDown(e, tab.id)}\n        @focus=${() => this.handleTabFocus(tab.id)}\n        @blur=${this.handleTabBlur}\n      >\n        ${tab.icon\n          ? html`<bp-icon name=${tab.icon} class=\"tab__icon\"></bp-icon>`\n          : nothing}\n        <span class=\"tab__label\">${tab.label}</span>\n        ${tab.closable\n          ? html`\n              <button\n                class=\"tab__close\"\n                part=\"tab-close\"\n                aria-label=\"Close ${tab.label}\"\n                @click=${(e: Event) => this.handleTabClose(e, tab.id)}\n                @keydown=${(e: KeyboardEvent) => e.stopPropagation()}\n              >\n                <svg\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                >\n                  <path d=\"M18 6L6 18M6 6l12 12\" />\n                </svg>\n              </button>\n            `\n          : nothing}\n      </button>\n    `;\n  }\n\n  render() {\n    const containerClasses = {\n      tabs: true,\n      [`tabs--${this.size}`]: true,\n      [`tabs--${this.variant}`]: true,\n      [`tabs--${this.placement}`]: true,\n      'tabs--disabled': this.disabled,\n    };\n\n    const isVertical = this.placement === 'start' || this.placement === 'end';\n\n    return html`\n      <div\n        class=${classMap(containerClasses)}\n        part=\"tabs\"\n        aria-orientation=${isVertical ? 'vertical' : 'horizontal'}\n      >\n        <div class=\"tablist\" part=\"tablist\" role=\"tablist\">\n          ${repeat(\n            this.tabs,\n            (tab) => tab.id,\n            (tab) => this.renderTab(tab)\n          )}\n        </div>\n        <div class=\"panels\" part=\"panels\">\n          <slot @slotchange=${this.handleSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\n/**\n * A tab panel component for use with bp-tabs.\n *\n * @element bp-tab-panel\n *\n * @property {string} tabId - The ID that links this panel to its tab\n *\n * @slot - Content of the panel\n *\n * @csspart panel - The panel container\n */\n@customElement('bp-tab-panel')\nexport class BpTabPanel extends LitElement {\n  /**\n   * The ID that links this panel to its tab\n   */\n  @property({ type: String, attribute: 'tab-id', reflect: true })\n  declare tabId: string;\n\n  constructor() {\n    super();\n    this.tabId = '';\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.setAttribute('role', 'tabpanel');\n    this.setAttribute('data-tab-id', this.tabId);\n  }\n\n  updated(changedProperties: Map<string, unknown>): void {\n    super.updated(changedProperties);\n    if (changedProperties.has('tabId')) {\n      this.setAttribute('data-tab-id', this.tabId);\n      this.id = `panel-${this.tabId}`;\n      this.setAttribute('aria-labelledby', `tab-${this.tabId}`);\n    }\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-tabs': BpTabs;\n    'bp-tab-panel': BpTabPanel;\n  }\n}\n"],"names":["tabsStyles","css","BpTabs","LitElement","firstEnabled","tab","panels","tabId","disabled","event","enabledTabs","currentIndex","newIndex","handled","t","newTab","closedIndex","nextIndex","changedProperties","el","panel","isActive","previousValue","isDisabled","html","classMap","e","nothing","containerClasses","isVertical","repeat","__decorateClass","property","state","queryAssignedElements","customElement","BpTabPanel"],"mappings":";;;;AAEO,MAAMA,IAAaC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA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"}

package/dist/components/tag.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tag.js","sources":["../../source/components/tag/tag.style.ts","../../source/components/tag/tag.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const tagStyles = css`\n  /* Base styles */\n  :host {\n    display: inline-block;\n  }\n\n  .tag {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--bp-spacing-xs);\n    font-family: var(--bp-font-family);\n    font-weight: var(--bp-font-weight-medium);\n    line-height: 1.5;\n    border-radius: var(--bp-border-radius-md);\n    border: var(--bp-border-width) solid transparent;\n    transition:\n      background-color var(--bp-transition-fast),\n      border-color var(--bp-transition-fast),\n      color var(--bp-transition-fast),\n      box-shadow var(--bp-transition-fast);\n    cursor: default;\n  }\n\n  .tag:focus-visible {\n    outline: var(--bp-border-width) solid var(--bp-color-focus);\n    outline-offset: var(--bp-border-width);\n  }\n\n  .tag__content {\n    flex: 1;\n  }\n\n  .tag__close {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0;\n    margin: 0;\n    background: transparent;\n    border: none;\n    cursor: pointer;\n    color: inherit;\n    opacity: 0.7;\n    transition: opacity var(--bp-transition-fast);\n    flex-shrink: 0;\n  }\n\n  .tag__close:hover {\n    opacity: 1;\n  }\n\n  .tag__close:focus-visible {\n    outline: var(--bp-border-width) solid currentColor;\n    outline-offset: var(--bp-border-width);\n    border-radius: var(--bp-border-radius-sm);\n    opacity: 1;\n  }\n\n  /* Variants - Solid */\n  .tag--solid.tag--primary {\n    background-color: var(--bp-color-primary);\n    color: var(--bp-color-text-inverse);\n  }\n\n  .tag--solid.tag--success {\n    background-color: var(--bp-color-success);\n    color: var(--bp-color-text-inverse);\n  }\n\n  .tag--solid.tag--error {\n    background-color: var(--bp-color-error);\n    color: var(--bp-color-text-inverse);\n  }\n\n  .tag--solid.tag--warning {\n    background-color: var(--bp-color-warning);\n    color: var(--bp-color-text-inverse);\n  }\n\n  .tag--solid.tag--info {\n    background-color: var(--bp-color-info);\n    color: var(--bp-color-text-inverse);\n  }\n\n  .tag--solid.tag--neutral {\n    background-color: var(--bp-color-border-strong);\n    color: var(--bp-color-text);\n  }\n\n  /* Variants - Outlined */\n  .tag--outlined {\n    background-color: transparent;\n  }\n\n  .tag--outlined.tag--primary {\n    border-color: var(--bp-color-primary);\n    color: var(--bp-color-primary);\n  }\n\n  .tag--outlined.tag--success {\n    border-color: var(--bp-color-success);\n    color: var(--bp-color-success);\n  }\n\n  .tag--outlined.tag--error {\n    border-color: var(--bp-color-error);\n    color: var(--bp-color-error);\n  }\n\n  .tag--outlined.tag--warning {\n    border-color: var(--bp-color-warning);\n    color: var(--bp-color-warning);\n  }\n\n  .tag--outlined.tag--info {\n    border-color: var(--bp-color-info);\n    color: var(--bp-color-info);\n  }\n\n  .tag--outlined.tag--neutral {\n    border-color: var(--bp-color-border);\n    color: var(--bp-color-text);\n  }\n\n  /* Sizes */\n  .tag--sm {\n    padding: var(--bp-spacing-xs) var(--bp-spacing-sm);\n    font-size: var(--bp-font-size-xs);\n    height: var(--bp-spacing-6);\n  }\n\n  .tag--sm .tag__close {\n    width: var(--bp-spacing-4);\n    height: var(--bp-spacing-4);\n  }\n\n  .tag--md {\n    padding: var(--bp-spacing-xs) var(--bp-spacing-md);\n    font-size: var(--bp-font-size-sm);\n    height: var(--bp-spacing-8);\n  }\n\n  .tag--md .tag__close {\n    width: var(--bp-spacing-5);\n    height: var(--bp-spacing-5);\n  }\n\n  .tag--lg {\n    padding: var(--bp-spacing-sm) var(--bp-spacing-lg);\n    font-size: var(--bp-font-size-base);\n    height: var(--bp-spacing-10);\n  }\n\n  .tag--lg .tag__close {\n    width: var(--bp-spacing-6);\n    height: var(--bp-spacing-6);\n  }\n\n  /* States */\n  .tag--removable {\n    cursor: pointer;\n  }\n\n  .tag--removable:hover {\n    filter: brightness(0.95);\n  }\n\n  .tag--disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  .tag--disabled .tag__close {\n    cursor: not-allowed;\n    opacity: 0.5;\n  }\n\n  /* Touch target size: ensure 44x44px minimum on touch devices */\n  @media (pointer: coarse) {\n    .tag__close {\n      position: relative;\n      min-width: 24px;\n      min-height: 24px;\n    }\n\n    /* Expand touch target with pseudo-element */\n    .tag__close::before {\n      content: '';\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      width: 44px;\n      height: 44px;\n    }\n  }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tagStyles } from './tag.style.js';\nimport { crossSvg } from '../icon/icons/entries/cross.js';\nimport '../icon/icon.js';\n\n/**\n * Tag component for displaying removable labels, chips, or category markers.\n *\n * @element bp-tag\n *\n * @slot - Default slot for tag content (text)\n *\n * @csspart tag - The tag container element\n * @csspart close-button - The close/remove button element\n *\n * @fires bp-remove - Fired when the tag is removed (cancelable)\n *\n * @example\n * ```html\n * <bp-tag>Design</bp-tag>\n * <bp-tag variant=\"outlined\" removable>TypeScript</bp-tag>\n * <bp-tag variant=\"success\" size=\"sm\">Active</bp-tag>\n * ```\n */\n@customElement('bp-tag')\nexport class BpTag extends LitElement {\n  /**\n   * Visual variant of the tag\n   * @type {'solid' | 'outlined'}\n   * @default 'solid'\n   */\n  @property({ type: String, reflect: true }) declare variant:\n    | 'solid'\n    | 'outlined';\n\n  /**\n   * Size of the tag\n   * @type {'sm' | 'md' | 'lg'}\n   * @default 'md'\n   */\n  @property({ type: String, reflect: true }) declare size: 'sm' | 'md' | 'lg';\n\n  /**\n   * Color scheme of the tag\n   * @type {'primary' | 'success' | 'error' | 'warning' | 'info' | 'neutral'}\n   * @default 'neutral'\n   */\n  @property({ type: String, reflect: true }) declare color:\n    | 'primary'\n    | 'success'\n    | 'error'\n    | 'warning'\n    | 'info'\n    | 'neutral';\n\n  /**\n   * Whether the tag can be removed\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true }) declare removable: boolean;\n\n  /**\n   * Whether the tag is disabled\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true }) declare disabled: boolean;\n\n  static styles = [tagStyles];\n\n  constructor() {\n    super();\n    this.variant = 'solid';\n    this.size = 'md';\n    this.color = 'neutral';\n    this.removable = false;\n    this.disabled = false;\n  }\n\n  private handleRemove(event: Event) {\n    event.stopPropagation();\n\n    if (this.disabled) {\n      return;\n    }\n\n    const removeEvent = new CustomEvent('bp-remove', {\n      detail: {\n        color: this.color,\n        timestamp: Date.now(),\n      },\n      bubbles: true,\n      composed: true,\n      cancelable: true,\n    });\n\n    this.dispatchEvent(removeEvent);\n\n    // Only remove if event wasn't prevented\n    if (!removeEvent.defaultPrevented) {\n      this.remove();\n    }\n  }\n\n  private handleKeyDown(event: Event) {\n    if (this.disabled) {\n      return;\n    }\n\n    const keyboardEvent = event as unknown as {\n      key: string;\n      preventDefault: () => void;\n    };\n\n    // Allow removing with Delete or Backspace when focused\n    if (\n      this.removable &&\n      (keyboardEvent.key === 'Delete' || keyboardEvent.key === 'Backspace')\n    ) {\n      keyboardEvent.preventDefault();\n      this.handleRemove(event);\n    }\n  }\n\n  render() {\n    const classes = {\n      tag: true,\n      [`tag--${this.variant}`]: true,\n      [`tag--${this.size}`]: true,\n      [`tag--${this.color}`]: true,\n      'tag--disabled': this.disabled,\n      'tag--removable': this.removable,\n    };\n\n    // Map tag size to icon size (icons should be smaller)\n    const iconSize =\n      this.size === 'sm' ? 'xs' : this.size === 'lg' ? 'sm' : 'xs';\n\n    return html`\n      <div\n        class=${classMap(classes)}\n        part=\"tag\"\n        role=\"status\"\n        aria-disabled=${this.disabled}\n        @keydown=${this.handleKeyDown}\n        tabindex=${this.removable && !this.disabled ? '0' : '-1'}\n      >\n        <span class=\"tag__content\">\n          <slot></slot>\n        </span>\n        ${this.removable\n          ? html`\n              <button\n                type=\"button\"\n                class=\"tag__close\"\n                part=\"close-button\"\n                aria-label=\"Remove\"\n                ?disabled=${this.disabled}\n                @click=${this.handleRemove}\n                tabindex=\"-1\"\n              >\n                <bp-icon .svg=${crossSvg} size=${iconSize}></bp-icon>\n              </button>\n            `\n          : ''}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-tag': BpTag;\n  }\n}\n"],"names":["tagStyles","css","BpTag","LitElement","event","removeEvent","keyboardEvent","classes","iconSize","html","classMap","crossSvg","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/components/text.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"text.js","sources":["../../source/components/text/text.style.ts","../../source/components/text/text.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const textStyles = css`\n  /* Base styles */\n  :host {\n    display: inline-block;\n  }\n\n  :host([as='span']) {\n    display: inline;\n  }\n\n  .text {\n    margin: 0;\n    padding: 0;\n    font-family: var(--bp-font-family);\n    color: var(--bp-color-text);\n    line-height: var(--bp-line-height-normal);\n  }\n\n  /* Sizes */\n  .text--xs {\n    font-size: var(--bp-font-size-xs);\n  }\n\n  .text--sm {\n    font-size: var(--bp-font-size-sm);\n  }\n\n  .text--base {\n    font-size: var(--bp-font-size-base);\n  }\n\n  .text--lg {\n    font-size: var(--bp-font-size-lg);\n  }\n\n  .text--xl {\n    font-size: var(--bp-font-size-xl);\n  }\n\n  /* Font weights */\n  .text--light {\n    font-weight: var(--bp-font-weight-light);\n  }\n\n  .text--normal {\n    font-weight: var(--bp-font-weight-normal);\n  }\n\n  .text--medium {\n    font-weight: var(--bp-font-weight-medium);\n  }\n\n  .text--semibold {\n    font-weight: var(--bp-font-weight-semibold);\n  }\n\n  .text--bold {\n    font-weight: var(--bp-font-weight-bold);\n  }\n\n  /* Variants */\n  .text--default {\n    color: var(--bp-color-text);\n  }\n\n  .text--muted {\n    color: var(--bp-color-text-muted);\n  }\n\n  .text--primary {\n    color: var(--bp-color-primary);\n  }\n\n  .text--success {\n    color: var(--bp-color-success);\n  }\n\n  .text--warning {\n    color: var(--bp-color-warning);\n  }\n\n  .text--error {\n    color: var(--bp-color-error);\n  }\n\n  /* Alignment */\n  .text--align-left {\n    text-align: left;\n  }\n\n  .text--align-center {\n    text-align: center;\n  }\n\n  .text--align-right {\n    text-align: right;\n  }\n\n  .text--align-justify {\n    text-align: justify;\n  }\n\n  /* Text transform */\n  .text--transform-uppercase {\n    text-transform: uppercase;\n  }\n\n  .text--transform-lowercase {\n    text-transform: lowercase;\n  }\n\n  .text--transform-capitalize {\n    text-transform: capitalize;\n  }\n\n  /* Letter spacing (tracking) */\n  .text--tracking-tighter {\n    letter-spacing: -0.05em;\n  }\n\n  .text--tracking-tight {\n    letter-spacing: -0.025em;\n  }\n\n  .text--tracking-wide {\n    letter-spacing: 0.025em;\n  }\n\n  .text--tracking-wider {\n    letter-spacing: 0.05em;\n  }\n\n  /* Line height variants */\n  .text--line-height-none {\n    line-height: var(--bp-line-height-none);\n  }\n\n  .text--line-height-tight {\n    line-height: var(--bp-line-height-tight);\n  }\n\n  .text--line-height-snug {\n    line-height: var(--bp-line-height-snug);\n  }\n\n  .text--line-height-relaxed {\n    line-height: var(--bp-line-height-relaxed);\n  }\n\n  .text--line-height-loose {\n    line-height: var(--bp-line-height-loose);\n  }\n\n  /* Multi-line clamp */\n  .text--clamp-1,\n  .text--clamp-2,\n  .text--clamp-3,\n  .text--clamp-4,\n  .text--clamp-5,\n  .text--clamp-6 {\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n  }\n\n  .text--clamp-1 {\n    -webkit-line-clamp: 1;\n  }\n\n  .text--clamp-2 {\n    -webkit-line-clamp: 2;\n  }\n\n  .text--clamp-3 {\n    -webkit-line-clamp: 3;\n  }\n\n  .text--clamp-4 {\n    -webkit-line-clamp: 4;\n  }\n\n  .text--clamp-5 {\n    -webkit-line-clamp: 5;\n  }\n\n  .text--clamp-6 {\n    -webkit-line-clamp: 6;\n  }\n\n  /* States */\n  .text--italic {\n    font-style: italic;\n  }\n\n  .text--truncate {\n    display: block;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    max-width: 100%;\n  }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { textStyles } from './text.style.js';\n\nexport type TextElement = 'p' | 'span' | 'div';\nexport type TextSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl';\nexport type TextWeight = 'light' | 'normal' | 'medium' | 'semibold' | 'bold';\nexport type TextVariant =\n  | 'default'\n  | 'muted'\n  | 'primary'\n  | 'success'\n  | 'warning'\n  | 'error';\nexport type TextAlign = 'left' | 'center' | 'right' | 'justify';\nexport type TextTransform = 'none' | 'uppercase' | 'lowercase' | 'capitalize';\nexport type TextTracking = 'tighter' | 'tight' | 'normal' | 'wide' | 'wider';\nexport type TextLineHeight =\n  | 'none'\n  | 'tight'\n  | 'snug'\n  | 'normal'\n  | 'relaxed'\n  | 'loose';\n\n/**\n * A typography component for body text with flexible styling options.\n *\n * @element bp-text\n *\n * @property {TextElement} as - The HTML element type to render\n * @property {TextSize} size - The size of the text\n * @property {TextWeight} weight - The font weight\n * @property {TextVariant} variant - The color variant\n * @property {TextAlign} align - Text alignment\n * @property {TextTransform} transform - Text transformation (uppercase, lowercase, capitalize)\n * @property {TextTracking} tracking - Letter spacing\n * @property {TextLineHeight} lineHeight - Line height variant\n * @property {number} clamp - Number of lines to clamp (multi-line truncation)\n * @property {boolean} italic - Whether the text is italic\n * @property {boolean} truncate - Whether to truncate with ellipsis\n *\n * @slot - The text content\n *\n * @csspart text - The text container element\n */\n@customElement('bp-text')\nexport class BpText extends LitElement {\n  /**\n   * The element type to render.\n   */\n  @property({ type: String, reflect: true }) declare as: TextElement;\n\n  /**\n   * The size of the text.\n   */\n  @property({ type: String, reflect: true }) declare size: TextSize;\n\n  /**\n   * The font weight of the text.\n   */\n  @property({ type: String, reflect: true }) declare weight: TextWeight;\n\n  /**\n   * The color variant of the text.\n   */\n  @property({ type: String, reflect: true }) declare variant: TextVariant;\n\n  /**\n   * The text alignment.\n   */\n  @property({ type: String, reflect: true }) declare align: TextAlign;\n\n  /**\n   * Text transformation.\n   */\n  @property({ type: String, reflect: true }) declare transform: TextTransform;\n\n  /**\n   * Letter spacing (tracking).\n   */\n  @property({ type: String, reflect: true }) declare tracking: TextTracking;\n\n  /**\n   * Line height variant.\n   */\n  @property({ type: String, reflect: true, attribute: 'line-height' })\n  declare lineHeight: TextLineHeight;\n\n  /**\n   * Number of lines to clamp (multi-line truncation).\n   * When set, text will be truncated to the specified number of lines.\n   */\n  @property({ type: Number, reflect: true }) declare clamp: number;\n\n  /**\n   * Whether the text should be italic.\n   */\n  @property({ type: Boolean, reflect: true }) declare italic: boolean;\n\n  /**\n   * Whether the text should be truncated with ellipsis.\n   */\n  @property({ type: Boolean, reflect: true }) declare truncate: boolean;\n\n  static styles = [textStyles];\n\n  constructor() {\n    super();\n    this.as = 'p';\n    this.size = 'base';\n    this.weight = 'normal';\n    this.variant = 'default';\n    this.align = 'left';\n    this.transform = 'none';\n    this.tracking = 'normal';\n    this.lineHeight = 'normal';\n    this.clamp = 0;\n    this.italic = false;\n    this.truncate = false;\n  }\n\n  render() {\n    const classes = [\n      'text',\n      `text--${this.size}`,\n      `text--${this.weight}`,\n      `text--${this.variant}`,\n      `text--align-${this.align}`,\n      this.transform !== 'none' ? `text--transform-${this.transform}` : '',\n      this.tracking !== 'normal' ? `text--tracking-${this.tracking}` : '',\n      this.lineHeight !== 'normal'\n        ? `text--line-height-${this.lineHeight}`\n        : '',\n      this.clamp > 0 ? `text--clamp-${this.clamp}` : '',\n      this.italic ? 'text--italic' : '',\n      this.truncate ? 'text--truncate' : '',\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    // Render the appropriate element based on 'as' prop\n    switch (this.as) {\n      case 'span':\n        return html`<span part=\"text\" class=\"${classes}\"><slot></slot></span>`;\n      case 'div':\n        return html`<div part=\"text\" class=\"${classes}\"><slot></slot></div>`;\n      case 'p':\n      default:\n        return html`<p part=\"text\" class=\"${classes}\"><slot></slot></p>`;\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-text': BpText;\n  }\n}\n"],"names":["textStyles","css","BpText","LitElement","classes","html","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/components/textarea.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"textarea.js","sources":["../../source/components/textarea/textarea.style.ts","../../source/components/textarea/textarea.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const textareaStyles = css`\n  /* Base styles */\n  :host {\n    display: block;\n  }\n\n  .textarea-wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--bp-spacing-xs);\n  }\n\n  .textarea-label {\n    font-family: var(--bp-font-family);\n    font-size: var(--bp-font-size-sm);\n    font-weight: var(--bp-font-weight-medium);\n    color: var(--bp-color-text);\n    line-height: var(--bp-line-height-normal);\n  }\n\n  .textarea-required {\n    color: var(--bp-color-error);\n    margin-left: var(--bp-spacing-xs);\n  }\n\n  .textarea {\n    font-family: var(--bp-font-family);\n    font-size: var(--bp-font-size-base);\n    line-height: var(--bp-line-height-normal);\n    color: var(--bp-color-text);\n    background-color: var(--bp-color-background);\n    border: var(--bp-border-width) solid var(--bp-color-border);\n    border-radius: var(--bp-border-radius-md);\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n    box-shadow: inset 0 1px 2px oklch(0 0 0 / 0.05);\n    transition:\n      border-color var(--bp-transition-fast),\n      box-shadow var(--bp-transition-fast);\n    width: 100%;\n    box-sizing: border-box;\n    min-height: var(--bp-spacing-20);\n  }\n\n  .textarea::placeholder {\n    color: var(--bp-color-text-muted);\n    opacity: var(--bp-opacity-subtle);\n  }\n\n  /* Variants */\n  .textarea--default {\n    border-color: var(--bp-color-border);\n  }\n\n  .textarea--success {\n    border-color: var(--bp-color-success);\n  }\n\n  .textarea--error {\n    border-color: var(--bp-color-error);\n  }\n\n  .textarea--warning {\n    border-color: var(--bp-color-warning);\n  }\n\n  .textarea--info {\n    border-color: var(--bp-color-info);\n  }\n\n  /* Sizes */\n  .textarea--sm {\n    font-size: var(--bp-font-size-sm);\n    padding: var(--bp-spacing-xs) var(--bp-spacing-sm);\n    min-height: var(--bp-spacing-16);\n  }\n\n  .textarea--md {\n    font-size: var(--bp-font-size-base);\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n    min-height: var(--bp-spacing-20);\n  }\n\n  .textarea--lg {\n    font-size: var(--bp-font-size-lg);\n    padding: var(--bp-spacing-md) var(--bp-spacing-lg);\n    min-height: var(--bp-spacing-24);\n  }\n\n  /* Resize variants */\n  .textarea--resize-none {\n    resize: none;\n  }\n\n  .textarea--resize-both {\n    resize: both;\n  }\n\n  .textarea--resize-horizontal {\n    resize: horizontal;\n  }\n\n  .textarea--resize-vertical {\n    resize: vertical;\n  }\n\n  /* States */\n  .textarea:hover:not(:disabled):not(:focus) {\n    border-color: var(--bp-color-border-strong);\n  }\n\n  .textarea:focus {\n    outline: none;\n    border-color: var(--bp-color-focus);\n    box-shadow: 0 0 0 var(--bp-focus-offset) var(--bp-color-focus);\n  }\n\n  .textarea:focus-visible {\n    outline: none;\n    border-color: var(--bp-color-focus);\n    box-shadow: 0 0 0 var(--bp-focus-offset) var(--bp-color-focus);\n  }\n\n  .textarea:disabled {\n    opacity: var(--bp-opacity-disabled);\n    cursor: not-allowed;\n    background-color: var(--bp-color-surface-subdued);\n  }\n\n  .textarea:read-only {\n    background-color: var(--bp-color-surface);\n    cursor: default;\n  }\n\n  /* Variant-specific focus states */\n  .textarea--success:focus,\n  .textarea--success:focus-visible {\n    border-color: var(--bp-color-success);\n    box-shadow: 0 0 0 var(--bp-focus-offset) var(--bp-color-success);\n  }\n\n  .textarea--error:focus,\n  .textarea--error:focus-visible {\n    border-color: var(--bp-color-error);\n    box-shadow: 0 0 0 var(--bp-focus-offset) var(--bp-color-error);\n  }\n\n  .textarea--warning:focus,\n  .textarea--warning:focus-visible {\n    border-color: var(--bp-color-warning);\n    box-shadow: 0 0 0 var(--bp-focus-offset) var(--bp-color-warning);\n  }\n\n  .textarea--info:focus,\n  .textarea--info:focus-visible {\n    border-color: var(--bp-color-info);\n    box-shadow: 0 0 0 var(--bp-focus-offset) var(--bp-color-info);\n  }\n\n  /* Messages */\n  .textarea-message {\n    font-family: var(--bp-font-family);\n    font-size: var(--bp-font-size-sm);\n    line-height: var(--bp-line-height-normal);\n    color: var(--bp-color-text-muted);\n  }\n\n  .textarea-message--error {\n    color: var(--bp-color-error);\n  }\n\n  /* iOS zoom prevention: ensure 16px minimum on touch devices */\n  @media (max-width: 768px) {\n    .textarea--sm {\n      font-size: 16px;\n    }\n  }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { textareaStyles } from './textarea.style.js';\nimport { debounce } from '../../utilities/debounce.js';\nimport { booleanConverter } from '../../utilities/boolean-converter.js';\n\n/**\n * Visual variant that affects the textarea border color and validation state\n */\nexport type TextareaVariant =\n  | 'default'\n  | 'success'\n  | 'error'\n  | 'warning'\n  | 'info';\n\n/**\n * Size of the textarea affecting padding, font size, and minimum height\n */\nexport type TextareaSize = 'sm' | 'md' | 'lg';\n\n/**\n * Resize mode determining how users can resize the textarea\n */\nexport type TextareaResize = 'none' | 'both' | 'horizontal' | 'vertical';\n\n/**\n * Valid autocomplete values for textarea elements\n */\nexport type TextareaAutocomplete =\n  | 'off'\n  | 'on'\n  | 'name'\n  | 'email'\n  | 'username'\n  | 'street-address'\n  | 'address-line1'\n  | 'address-line2'\n  | 'address-line3'\n  | 'address-level1'\n  | 'address-level2'\n  | 'address-level3'\n  | 'address-level4'\n  | 'country'\n  | 'country-name'\n  | 'postal-code'\n  | 'organization'\n  | 'organization-title';\n\n/**\n * A multi-line text input component with support for various states and configurations.\n *\n * @fires bp-input - Dispatched when the textarea value changes (on every keystroke)\n * @fires bp-change - Dispatched when the textarea loses focus after being changed\n * @fires bp-focus - Dispatched when the textarea receives focus\n * @fires bp-blur - Dispatched when the textarea loses focus\n */\n@customElement('bp-textarea')\nexport class BpTextarea extends LitElement {\n  /** Visual variant of the textarea */\n  @property({ type: String, reflect: true }) declare variant: TextareaVariant;\n\n  /** Size of the textarea */\n  @property({ type: String, reflect: true }) declare size: TextareaSize;\n\n  /** Current value of the textarea */\n  @property({ type: String, reflect: true }) declare value: string;\n\n  /** Placeholder text shown when textarea is empty */\n  @property({ type: String, reflect: true }) declare placeholder:\n    | string\n    | undefined;\n\n  /** Label text displayed above the textarea */\n  @property({ type: String, reflect: true }) declare label: string | undefined;\n\n  /** Helper text displayed below the textarea */\n  @property({ type: String, reflect: true }) declare helperText:\n    | string\n    | undefined;\n\n  /** Error message displayed when variant is 'error' */\n  @property({ type: String, reflect: true }) declare errorMessage:\n    | string\n    | undefined;\n\n  /** Whether the textarea is disabled */\n  @property({ type: Boolean, reflect: true }) declare disabled: boolean;\n\n  /** Whether the textarea is required */\n  @property({ type: Boolean, reflect: true }) declare required: boolean;\n\n  /** Whether the textarea is readonly */\n  @property({ type: Boolean, reflect: true }) declare readonly: boolean;\n\n  /** Name attribute for form submission */\n  @property({ type: String, reflect: true }) declare name: string | undefined;\n\n  /** Number of visible text rows */\n  @property({ type: Number, reflect: true }) declare rows: number | undefined;\n\n  /** Number of visible text columns */\n  @property({ type: Number, reflect: true }) declare cols: number | undefined;\n\n  /** Maximum number of characters allowed */\n  @property({ type: Number, reflect: true }) declare maxlength:\n    | number\n    | undefined;\n\n  /** Minimum number of characters required */\n  @property({ type: Number, reflect: true }) declare minlength:\n    | number\n    | undefined;\n\n  /** How the textarea can be resized by the user */\n  @property({ type: String, reflect: true }) declare resize: TextareaResize;\n\n  /** Autocomplete attribute for browser suggestions */\n  @property({ type: String, reflect: true }) declare autocomplete:\n    | TextareaAutocomplete\n    | undefined;\n\n  /** Whether to enable spellcheck */\n  @property({ converter: booleanConverter, reflect: true })\n  declare spellcheck: boolean;\n\n  /** Wrap attribute for text wrapping behavior */\n  @property({ type: String, reflect: true }) declare wrap:\n    | 'soft'\n    | 'hard'\n    | undefined;\n\n  @query('textarea') private textareaElement?: HTMLTextAreaElement;\n\n  private debouncedDispatchInput = debounce(\n    (value: string, originalEvent: InputEvent) => {\n      this.dispatchEvent(\n        new CustomEvent('bp-input', {\n          detail: { value, originalEvent },\n          bubbles: true,\n          composed: true,\n        })\n      );\n    },\n    150\n  );\n\n  static styles = [textareaStyles];\n\n  constructor() {\n    super();\n    this.variant = 'default';\n    this.size = 'md';\n    this.value = '';\n    this.disabled = false;\n    this.required = false;\n    this.readonly = false;\n    this.resize = 'vertical';\n    this.spellcheck = true;\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.debouncedDispatchInput.cancel();\n  }\n\n  private handleInput(event: InputEvent): void {\n    const target = event.target as HTMLTextAreaElement;\n    this.value = target.value;\n    this.debouncedDispatchInput(this.value, event);\n  }\n\n  private handleChange(event: Event): void {\n    const target = event.target as HTMLTextAreaElement;\n    this.value = target.value;\n\n    this.dispatchEvent(\n      new CustomEvent('bp-change', {\n        detail: { value: this.value, originalEvent: event },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private handleFocus(event: FocusEvent): void {\n    this.dispatchEvent(\n      new CustomEvent('bp-focus', {\n        detail: { originalEvent: event },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private handleBlur(event: FocusEvent): void {\n    this.debouncedDispatchInput.flush();\n    this.dispatchEvent(\n      new CustomEvent('bp-blur', {\n        detail: { originalEvent: event },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  /**\n   * Focuses the textarea element\n   */\n  public focus(): void {\n    this.textareaElement?.focus();\n  }\n\n  /**\n   * Blurs the textarea element\n   */\n  public blur(): void {\n    this.textareaElement?.blur();\n  }\n\n  /**\n   * Selects the text in the textarea\n   */\n  public select(): void {\n    this.textareaElement?.select();\n  }\n\n  private get messageId(): string {\n    const showError = this.variant === 'error' && this.errorMessage;\n    const showHelper = this.helperText && !showError;\n    if (showError) return 'error-message';\n    if (showHelper) return 'helper-text';\n    return '';\n  }\n\n  render() {\n    const showError = this.variant === 'error' && this.errorMessage;\n    const showHelper = this.helperText && !showError;\n\n    return html`\n      <div class=\"textarea-wrapper\">\n        ${this.label\n          ? html`\n              <label class=\"textarea-label\" for=\"textarea\">\n                ${this.label}\n                ${this.required\n                  ? html`<span class=\"textarea-required\">*</span>`\n                  : ''}\n              </label>\n            `\n          : ''}\n\n        <textarea\n          part=\"textarea\"\n          id=\"textarea\"\n          class=\"textarea textarea--${this.variant} textarea--${this\n            .size} textarea--resize-${this.resize}\"\n          .value=${live(this.value)}\n          placeholder=${ifDefined(this.placeholder)}\n          ?disabled=${this.disabled}\n          ?required=${this.required}\n          ?readonly=${this.readonly}\n          name=${ifDefined(this.name)}\n          rows=${ifDefined(this.rows)}\n          cols=${ifDefined(this.cols)}\n          maxlength=${ifDefined(this.maxlength)}\n          minlength=${ifDefined(this.minlength)}\n          autocomplete=${ifDefined(this.autocomplete)}\n          ?spellcheck=${this.spellcheck}\n          wrap=${ifDefined(this.wrap)}\n          aria-invalid=${this.variant === 'error' ? 'true' : 'false'}\n          aria-describedby=${this.messageId || nothing}\n          @input=${this.handleInput}\n          @change=${this.handleChange}\n          @focus=${this.handleFocus}\n          @blur=${this.handleBlur}\n        ></textarea>\n\n        ${showError\n          ? html`\n              <div\n                id=\"error-message\"\n                class=\"textarea-message textarea-message--error\"\n                role=\"alert\"\n              >\n                ${this.errorMessage}\n              </div>\n            `\n          : ''}\n        ${showHelper\n          ? html`<div id=\"helper-text\" class=\"textarea-message\">\n              ${this.helperText}\n            </div>`\n          : ''}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-textarea': BpTextarea;\n  }\n}\n"],"names":["textareaStyles","css","BpTextarea","LitElement","debounce","value","originalEvent","event","target","showError","showHelper","html","live","ifDefined","nothing","__decorateClass","property","booleanConverter","query","customElement"],"mappings":"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"}

package/dist/components/time-picker.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"time-picker.js","sources":["../../source/components/time-picker/time-picker.style.ts","../../source/components/time-picker/time-picker.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const timePickerStyles = css`\n  /* Base styles */\n  :host {\n    display: inline-block;\n    width: 100%;\n  }\n\n  .time-picker {\n    position: relative;\n    font-family: var(--bp-font-family);\n  }\n\n  .label {\n    display: block;\n    font-size: var(--bp-font-size-sm);\n    font-weight: var(--bp-font-weight-medium);\n    color: var(--bp-color-text);\n    line-height: var(--bp-line-height-normal);\n    margin-bottom: var(--bp-spacing-xs);\n    cursor: pointer;\n  }\n\n  .label-required {\n    color: var(--bp-color-error);\n    margin-left: var(--bp-spacing-xs);\n  }\n\n  .input-wrapper {\n    position: relative;\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n  }\n\n  .input {\n    width: 100%;\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n    padding-right: var(--bp-spacing-2xl);\n    border: var(--bp-border-width) solid var(--bp-color-border);\n    border-radius: var(--bp-border-radius-md);\n    font-size: var(--bp-font-size-base);\n    font-family: var(--bp-font-family);\n    color: var(--bp-color-text);\n    background-color: var(--bp-color-surface);\n    cursor: pointer;\n    transition: border-color var(--bp-transition-fast);\n  }\n\n  .input::placeholder {\n    color: var(--bp-color-text-muted);\n  }\n\n  .icon {\n    position: absolute;\n    right: var(--bp-spacing-sm);\n    pointer-events: none;\n    font-size: var(--bp-font-size-lg);\n    color: var(--bp-color-text-muted);\n  }\n\n  .clear-button {\n    position: absolute;\n    right: var(--bp-spacing-xl);\n    background: none;\n    border: none;\n    border-radius: var(--bp-border-radius-sm);\n    font-size: var(--bp-font-size-xl);\n    color: var(--bp-color-text-muted);\n    cursor: pointer;\n    padding: 0;\n    width: var(--bp-spacing-lg);\n    height: var(--bp-spacing-lg);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition:\n      color var(--bp-transition-fast),\n      background-color var(--bp-transition-fast);\n  }\n\n  .dropdown {\n    position: absolute;\n    top: calc(100% + var(--bp-spacing-xs));\n    left: 0;\n    right: 0;\n    background-color: var(--bp-color-surface);\n    border: var(--bp-border-width) solid var(--bp-color-border);\n    border-top: calc(var(--bp-border-width) * 2) solid var(--bp-color-primary);\n    border-radius: var(--bp-border-radius-sm);\n    box-shadow: var(--bp-shadow-md);\n    max-height: 320px;\n    overflow-y: auto;\n    z-index: var(--bp-z-dropdown);\n    animation: slideDown var(--bp-transition-fast) ease-out;\n  }\n\n  @keyframes slideDown {\n    from {\n      opacity: 0;\n      transform: translateY(-8px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  .time-option {\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n    min-height: 44px;\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    font-size: var(--bp-font-size-base);\n    color: var(--bp-color-text);\n    transition: background-color var(--bp-transition-fast);\n  }\n\n  /* Variants */\n  .time-option--selected {\n    background-color: color-mix(\n      in srgb,\n      var(--bp-color-primary) 8%,\n      transparent\n    );\n    color: var(--bp-color-primary);\n    font-weight: var(--bp-font-weight-semibold);\n  }\n\n  /* Sizes */\n  .time-picker--sm .input {\n    padding: var(--bp-spacing-xs) var(--bp-spacing-sm);\n    padding-right: var(--bp-spacing-xl);\n    font-size: var(--bp-font-size-sm);\n  }\n\n  .time-picker--sm .icon {\n    font-size: var(--bp-font-size-base);\n  }\n\n  .time-picker--sm .clear-button {\n    right: var(--bp-spacing-lg);\n  }\n\n  .time-picker--lg .input {\n    padding: var(--bp-spacing-md) var(--bp-spacing-lg);\n    padding-right: var(--bp-spacing-24);\n    font-size: var(--bp-font-size-lg);\n  }\n\n  .time-picker--lg .icon {\n    font-size: var(--bp-font-size-xl);\n  }\n\n  .time-picker--lg .clear-button {\n    right: var(--bp-spacing-2xl);\n  }\n\n  /* States */\n  .input:hover:not(:disabled) {\n    border-color: var(--bp-color-primary);\n  }\n\n  .input[aria-expanded='true'] {\n    border-color: var(--bp-color-primary);\n  }\n\n  .input:focus {\n    outline: none;\n    border-color: var(--bp-color-focus);\n    box-shadow: 0 0 0 var(--bp-focus-width) var(--bp-color-focus);\n  }\n\n  .input:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .clear-button:hover {\n    color: var(--bp-color-primary);\n    background-color: color-mix(\n      in srgb,\n      var(--bp-color-primary) 8%,\n      transparent\n    );\n  }\n\n  .time-option:hover {\n    background-color: color-mix(\n      in srgb,\n      var(--bp-color-primary) 8%,\n      transparent\n    );\n  }\n\n  .time-option--selected:hover {\n    background-color: color-mix(\n      in srgb,\n      var(--bp-color-primary) 12%,\n      transparent\n    );\n  }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { timePickerStyles } from './time-picker.style.js';\n\nexport type TimePickerSize = 'sm' | 'md' | 'lg';\nexport type TimeFormat = '12' | '24';\n\n/**\n * A time picker component with dropdown time selection.\n *\n * @element bp-time-picker\n *\n * @fires bp-change - Fired when the selected time changes\n *\n * @csspart input-wrapper - The input wrapper container\n * @csspart input - The text input field\n * @csspart icon - The clock icon indicator\n * @csspart clear-button - The clear button\n * @csspart dropdown - The time options dropdown\n * @csspart time-option - Individual time option in dropdown\n */\n@customElement('bp-time-picker')\nexport class BpTimePicker extends LitElement {\n  @property({ type: String }) declare value: string;\n  @property({ type: String }) declare name: string;\n  @property({ type: String }) declare label: string;\n  @property({ type: String }) declare placeholder: string;\n  @property({ type: Boolean }) declare disabled: boolean;\n  @property({ type: Boolean }) declare required: boolean;\n  @property({ type: String }) declare size: TimePickerSize;\n  @property({ type: String }) declare format: TimeFormat;\n  @property({ type: Number }) declare step: number;\n\n  @state() private isOpen = false;\n  @state() private focusedHour: number | null = null;\n  @state() private focusedMinute: number | null = null;\n\n  static styles = [timePickerStyles];\n\n  constructor() {\n    super();\n    this.value = '';\n    this.name = '';\n    this.label = '';\n    this.placeholder = 'Select time';\n    this.disabled = false;\n    this.required = false;\n    this.size = 'md';\n    this.format = '12';\n    this.step = 15; // 15-minute intervals by default\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener('click', this.handleDocumentClick);\n  }\n\n  private handleDocumentClick = (e: MouseEvent) => {\n    if (!this.contains(e.target as globalThis.Node)) {\n      this.isOpen = false;\n    }\n  };\n\n  private toggleDropdown = () => {\n    if (this.disabled) return;\n    this.isOpen = !this.isOpen;\n\n    if (this.isOpen) {\n      // Add document click handler on next tick to avoid immediate close\n      globalThis.setTimeout(() => {\n        document.addEventListener('click', this.handleDocumentClick);\n      }, 0);\n      // Scroll to selected option\n      this.updateComplete.then(() => {\n        const selected = this.shadowRoot?.querySelector(\n          '.time-option--selected'\n        ) as HTMLElement;\n        if (selected) {\n          selected.scrollIntoView({ block: 'nearest' });\n        }\n      });\n    } else {\n      document.removeEventListener('click', this.handleDocumentClick);\n    }\n  };\n\n  private parseTime(\n    timeString: string\n  ): { hours: number; minutes: number } | null {\n    if (!timeString) return null;\n\n    const match = timeString.match(/^(\\d{1,2}):(\\d{2})(?:\\s*(AM|PM))?$/i);\n    if (!match) return null;\n\n    let hours = parseInt(match[1], 10);\n    const minutes = parseInt(match[2], 10);\n    const period = match[3]?.toUpperCase();\n\n    if (this.format === '12' && period) {\n      if (period === 'PM' && hours !== 12) hours += 12;\n      if (period === 'AM' && hours === 12) hours = 0;\n    }\n\n    if (hours < 0 || hours > 23 || minutes < 0 || minutes > 59) return null;\n\n    return { hours, minutes };\n  }\n\n  private formatTime(hours: number, minutes: number): string {\n    if (this.format === '24') {\n      return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}`;\n    }\n\n    const period = hours >= 12 ? 'PM' : 'AM';\n    const displayHours = hours === 0 ? 12 : hours > 12 ? hours - 12 : hours;\n    return `${displayHours}:${minutes.toString().padStart(2, '0')} ${period}`;\n  }\n\n  private getDisplayValue(): string {\n    if (!this.value) return '';\n\n    const parsed = this.parseTime(this.value);\n    if (!parsed) return this.value;\n\n    return this.formatTime(parsed.hours, parsed.minutes);\n  }\n\n  private generateTimeOptions(): Array<{\n    hours: number;\n    minutes: number;\n    display: string;\n  }> {\n    const options: Array<{ hours: number; minutes: number; display: string }> =\n      [];\n    const maxHours = this.format === '24' ? 23 : 11;\n\n    for (let h = 0; h <= maxHours; h++) {\n      for (let m = 0; m < 60; m += this.step) {\n        const hours = this.format === '24' ? h : h;\n        options.push({\n          hours,\n          minutes: m,\n          display: this.formatTime(hours, m),\n        });\n      }\n    }\n\n    // For 12-hour format, add PM times\n    if (this.format === '12') {\n      for (let h = 0; h <= 11; h++) {\n        for (let m = 0; m < 60; m += this.step) {\n          const hours = h + 12;\n          options.push({\n            hours,\n            minutes: m,\n            display: this.formatTime(hours, m),\n          });\n        }\n      }\n    }\n\n    return options;\n  }\n\n  private handleTimeSelect(hours: number, minutes: number) {\n    const newValue = this.formatTime(hours, minutes);\n    const oldValue = this.value;\n\n    this.value = newValue;\n    this.isOpen = false;\n\n    this.dispatchEvent(\n      new CustomEvent('bp-change', {\n        detail: { value: newValue, hours, minutes, previousValue: oldValue },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private handleClear(e: MouseEvent) {\n    e.stopPropagation();\n    const oldValue = this.value;\n    this.value = '';\n\n    this.dispatchEvent(\n      new CustomEvent('bp-change', {\n        detail: {\n          value: '',\n          hours: null,\n          minutes: null,\n          previousValue: oldValue,\n        },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private handleKeyDown(e: Event) {\n    const event = e as globalThis.KeyboardEvent;\n    if (!this.isOpen) {\n      if (\n        event.key === 'ArrowDown' ||\n        event.key === 'Enter' ||\n        event.key === ' '\n      ) {\n        event.preventDefault();\n        this.isOpen = true;\n      }\n      return;\n    }\n\n    switch (event.key) {\n      case 'Escape':\n        event.preventDefault();\n        this.isOpen = false;\n        break;\n\n      case 'ArrowDown':\n      case 'ArrowUp':\n        event.preventDefault();\n        // Navigate through time options\n        break;\n\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        if (this.focusedHour !== null && this.focusedMinute !== null) {\n          this.handleTimeSelect(this.focusedHour, this.focusedMinute);\n        }\n        break;\n    }\n  }\n\n  private isSelected(hours: number, minutes: number): boolean {\n    const parsed = this.parseTime(this.value);\n    if (!parsed) return false;\n    return parsed.hours === hours && parsed.minutes === minutes;\n  }\n\n  render() {\n    const displayValue = this.getDisplayValue();\n    const timeOptions = this.generateTimeOptions();\n\n    return html`\n      <div class=\"time-picker time-picker--${this.size}\">\n        ${this.label\n          ? html`\n              <label class=\"label\" part=\"label\" @click=${this.toggleDropdown}>\n                ${this.label}\n                ${this.required\n                  ? html`<span class=\"label-required\">*</span>`\n                  : ''}\n              </label>\n            `\n          : ''}\n        <div\n          class=\"input-wrapper\"\n          part=\"input-wrapper\"\n          @keydown=${this.handleKeyDown}\n        >\n          <input\n            type=\"text\"\n            class=\"input\"\n            part=\"input\"\n            .value=${displayValue}\n            placeholder=${this.placeholder}\n            ?disabled=${this.disabled}\n            ?required=${this.required}\n            name=${this.name}\n            readonly\n            aria-haspopup=\"listbox\"\n            aria-expanded=${this.isOpen}\n            aria-disabled=${this.disabled}\n            aria-label=${this.label || this.placeholder || 'Time picker'}\n            @click=${this.toggleDropdown}\n          />\n          ${this.value && !this.disabled\n            ? html`\n                <button\n                  type=\"button\"\n                  class=\"clear-button\"\n                  part=\"clear-button\"\n                  @click=${this.handleClear}\n                  aria-label=\"Clear time\"\n                  tabindex=\"-1\"\n                >\n                  ✕\n                </button>\n              `\n            : ''}\n          <div class=\"icon\" part=\"icon\">\n            <svg\n              width=\"16\"\n              height=\"16\"\n              viewBox=\"0 0 16 16\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M8 4V8L10.5 10.5M14 8C14 11.3137 11.3137 14 8 14C4.68629 14 2 11.3137 2 8C2 4.68629 4.68629 2 8 2C11.3137 2 14 4.68629 14 8Z\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.5\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </div>\n        </div>\n\n        ${this.isOpen\n          ? html`\n              <div class=\"dropdown\" part=\"dropdown\" role=\"listbox\">\n                ${timeOptions.map(\n                  (option) => html`\n                    <div\n                      class=${classMap({\n                        'time-option': true,\n                        'time-option--selected': this.isSelected(\n                          option.hours,\n                          option.minutes\n                        ),\n                      })}\n                      part=\"time-option\"\n                      role=\"option\"\n                      aria-selected=${this.isSelected(\n                        option.hours,\n                        option.minutes\n                      )}\n                      @click=${() =>\n                        this.handleTimeSelect(option.hours, option.minutes)}\n                    >\n                      ${option.display}\n                    </div>\n                  `\n                )}\n              </div>\n            `\n          : ''}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-time-picker': BpTimePicker;\n  }\n}\n"],"names":["timePickerStyles","css","BpTimePicker","LitElement","e","selected","timeString","match","hours","minutes","period","parsed","options","maxHours","h","m","newValue","oldValue","event","displayValue","timeOptions","html","option","classMap","__decorateClass","property","state","customElement"],"mappings":"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"}

package/dist/components/tooltip.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tooltip.js","sources":["../../source/components/tooltip/tooltip.style.ts","../../source/components/tooltip/tooltip.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const tooltipStyles = css`\n  /* Base styles */\n  :host {\n    display: inline-block;\n    position: relative;\n  }\n\n  .tooltip-wrapper {\n    position: relative;\n    display: inline-block;\n  }\n\n  .tooltip-trigger {\n    display: inline-block;\n  }\n\n  .tooltip-content {\n    position: absolute;\n    z-index: var(--bp-z-tooltip);\n    padding: var(--bp-spacing-sm) var(--bp-spacing-md);\n    background-color: var(--bp-color-text);\n    color: var(--bp-color-text-inverse);\n    border-radius: var(--bp-border-radius-sm);\n    font-size: var(--bp-font-size-sm);\n    font-family: var(--bp-font-family);\n    line-height: var(--bp-line-height-tight);\n    max-width: calc(var(--bp-spacing-24) * 3);\n    white-space: normal;\n    box-shadow: var(--bp-shadow-md);\n    pointer-events: none;\n    animation: tooltip-fade-in var(--bp-transition-fast);\n  }\n\n  @keyframes tooltip-fade-in {\n    from {\n      opacity: 0;\n      scale: 0.95;\n    }\n    to {\n      opacity: 1;\n      scale: 1;\n    }\n  }\n\n  /* Placement variants */\n  .tooltip-content--top {\n    bottom: calc(100% + var(--bp-spacing-xs));\n    left: 50%;\n    transform: translateX(-50%);\n  }\n\n  .tooltip-content--top::after {\n    content: '';\n    position: absolute;\n    top: 100%;\n    left: 50%;\n    transform: translateX(-50%);\n    border-width: var(--bp-spacing-sm);\n    border-style: solid;\n    border-color: var(--bp-color-text) transparent transparent transparent;\n  }\n\n  .tooltip-content--bottom {\n    top: calc(100% + var(--bp-spacing-xs));\n    left: 50%;\n    transform: translateX(-50%);\n  }\n\n  .tooltip-content--bottom::after {\n    content: '';\n    position: absolute;\n    bottom: 100%;\n    left: 50%;\n    transform: translateX(-50%);\n    border-width: var(--bp-spacing-sm);\n    border-style: solid;\n    border-color: transparent transparent var(--bp-color-text) transparent;\n  }\n\n  .tooltip-content--left {\n    right: calc(100% + var(--bp-spacing-xs));\n    top: 50%;\n    transform: translateY(-50%);\n  }\n\n  .tooltip-content--left::after {\n    content: '';\n    position: absolute;\n    left: 100%;\n    top: 50%;\n    transform: translateY(-50%);\n    border-width: var(--bp-spacing-sm);\n    border-style: solid;\n    border-color: transparent transparent transparent var(--bp-color-text);\n  }\n\n  .tooltip-content--right {\n    left: calc(100% + var(--bp-spacing-xs));\n    top: 50%;\n    transform: translateY(-50%);\n  }\n\n  .tooltip-content--right::after {\n    content: '';\n    position: absolute;\n    right: 100%;\n    top: 50%;\n    transform: translateY(-50%);\n    border-width: var(--bp-spacing-sm);\n    border-style: solid;\n    border-color: transparent var(--bp-color-text) transparent transparent;\n  }\n\n  /* States */\n  :host([disabled]) {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { tooltipStyles } from './tooltip.style.js';\n\nexport type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\n/**\n * A tooltip component that displays contextual information on hover or focus.\n *\n * @slot - The trigger element that shows the tooltip on hover/focus\n *\n * @cssprop --bp-tooltip-max-width - Maximum width of the tooltip content\n *\n * @fires bp-show - Fired when tooltip becomes visible\n * @fires bp-hide - Fired when tooltip becomes hidden\n */\n@customElement('bp-tooltip')\nexport class BpTooltip extends LitElement {\n  /**\n   * The text content to display in the tooltip\n   */\n  @property({ type: String }) declare content: string;\n\n  /**\n   * Placement of the tooltip relative to the trigger\n   */\n  @property({ type: String }) declare placement: TooltipPlacement;\n\n  /**\n   * Whether the tooltip is disabled\n   */\n  @property({ type: Boolean }) declare disabled: boolean;\n\n  /**\n   * Delay in milliseconds before showing the tooltip\n   */\n  @property({ type: Number }) declare delay: number;\n\n  /**\n   * Internal state tracking whether tooltip is visible\n   */\n  @state() private isVisible = false;\n\n  private showTimeout: number | null = null;\n  private hideTimeout: number | null = null;\n  private tooltipId = `tooltip-${Math.random().toString(36).substr(2, 9)}`;\n\n  static styles = [tooltipStyles];\n\n  constructor() {\n    super();\n    this.content = '';\n    this.placement = 'top';\n    this.disabled = false;\n    this.delay = 200;\n  }\n\n  private handleMouseEnter() {\n    if (this.disabled) return;\n\n    this.clearTimeouts();\n    this.showTimeout = window.setTimeout(() => {\n      this.isVisible = true;\n      this.dispatchEvent(\n        new CustomEvent('bp-show', {\n          detail: {\n            placement: this.placement,\n            content: this.content,\n          },\n          bubbles: true,\n          composed: true,\n        })\n      );\n    }, this.delay);\n  }\n\n  private handleMouseLeave() {\n    this.clearTimeouts();\n    this.hideTimeout = window.setTimeout(() => {\n      this.isVisible = false;\n      this.dispatchEvent(\n        new CustomEvent('bp-hide', {\n          detail: {\n            placement: this.placement,\n            content: this.content,\n          },\n          bubbles: true,\n          composed: true,\n        })\n      );\n    }, 100);\n  }\n\n  private handleFocus() {\n    if (this.disabled) return;\n    this.isVisible = true;\n    this.dispatchEvent(\n      new CustomEvent('bp-show', {\n        detail: {\n          placement: this.placement,\n          content: this.content,\n        },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private handleBlur() {\n    this.isVisible = false;\n    this.dispatchEvent(\n      new CustomEvent('bp-hide', {\n        detail: {\n          placement: this.placement,\n          content: this.content,\n        },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private clearTimeouts() {\n    if (this.showTimeout !== null) {\n      window.clearTimeout(this.showTimeout);\n      this.showTimeout = null;\n    }\n    if (this.hideTimeout !== null) {\n      window.clearTimeout(this.hideTimeout);\n      this.hideTimeout = null;\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.clearTimeouts();\n  }\n\n  render() {\n    return html`\n      <div\n        class=\"tooltip-wrapper\"\n        aria-describedby=${this.isVisible ? this.tooltipId : ''}\n        @mouseenter=${this.handleMouseEnter}\n        @mouseleave=${this.handleMouseLeave}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n      >\n        <div class=\"tooltip-trigger\" part=\"trigger\">\n          <slot></slot>\n        </div>\n        ${this.isVisible && !this.disabled\n          ? html`\n              <div\n                id=${this.tooltipId}\n                class=\"tooltip-content tooltip-content--${this.placement}\"\n                part=\"content\"\n                role=\"tooltip\"\n                aria-hidden=\"false\"\n              >\n                ${this.content}\n              </div>\n            `\n          : null}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-tooltip': BpTooltip;\n  }\n}\n"],"names":["tooltipStyles","css","BpTooltip","LitElement","html","__decorateClass","property","state","customElement"],"mappings":";;AAEO,MAAMA,IAAgBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACetB,IAAMC,IAAN,cAAwBC,EAAW;AAAA,EAgCxC,cAAc;AACZ,UAAA,GATO,KAAQ,YAAY,IAE7B,KAAQ,cAA6B,MACrC,KAAQ,cAA6B,MACrC,KAAQ,YAAY,WAAW,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,OAAO,GAAG,CAAC,CAAC,IAMpE,KAAK,UAAU,IACf,KAAK,YAAY,OACjB,KAAK,WAAW,IAChB,KAAK,QAAQ;AAAA,EACf;AAAA,EAEQ,mBAAmB;AACzB,IAAI,KAAK,aAET,KAAK,cAAA,GACL,KAAK,cAAc,OAAO,WAAW,MAAM;AACzC,WAAK,YAAY,IACjB,KAAK;AAAA,QACH,IAAI,YAAY,WAAW;AAAA,UACzB,QAAQ;AAAA,YACN,WAAW,KAAK;AAAA,YAChB,SAAS,KAAK;AAAA,UAAA;AAAA,UAEhB,SAAS;AAAA,UACT,UAAU;AAAA,QAAA,CACX;AAAA,MAAA;AAAA,IAEL,GAAG,KAAK,KAAK;AAAA,EACf;AAAA,EAEQ,mBAAmB;AACzB,SAAK,cAAA,GACL,KAAK,cAAc,OAAO,WAAW,MAAM;AACzC,WAAK,YAAY,IACjB,KAAK;AAAA,QACH,IAAI,YAAY,WAAW;AAAA,UACzB,QAAQ;AAAA,YACN,WAAW,KAAK;AAAA,YAChB,SAAS,KAAK;AAAA,UAAA;AAAA,UAEhB,SAAS;AAAA,UACT,UAAU;AAAA,QAAA,CACX;AAAA,MAAA;AAAA,IAEL,GAAG,GAAG;AAAA,EACR;AAAA,EAEQ,cAAc;AACpB,IAAI,KAAK,aACT,KAAK,YAAY,IACjB,KAAK;AAAA,MACH,IAAI,YAAY,WAAW;AAAA,QACzB,QAAQ;AAAA,UACN,WAAW,KAAK;AAAA,UAChB,SAAS,KAAK;AAAA,QAAA;AAAA,QAEhB,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA,EAEQ,aAAa;AACnB,SAAK,YAAY,IACjB,KAAK;AAAA,MACH,IAAI,YAAY,WAAW;AAAA,QACzB,QAAQ;AAAA,UACN,WAAW,KAAK;AAAA,UAChB,SAAS,KAAK;AAAA,QAAA;AAAA,QAEhB,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA,EAEQ,gBAAgB;AACtB,IAAI,KAAK,gBAAgB,SACvB,OAAO,aAAa,KAAK,WAAW,GACpC,KAAK,cAAc,OAEjB,KAAK,gBAAgB,SACvB,OAAO,aAAa,KAAK,WAAW,GACpC,KAAK,cAAc;AAAA,EAEvB;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA,GACN,KAAK,cAAA;AAAA,EACP;AAAA,EAEA,SAAS;AACP,WAAOC;AAAA;AAAA;AAAA,2BAGgB,KAAK,YAAY,KAAK,YAAY,EAAE;AAAA,sBACzC,KAAK,gBAAgB;AAAA,sBACrB,KAAK,gBAAgB;AAAA,iBAC1B,KAAK,WAAW;AAAA,gBACjB,KAAK,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,UAKrB,KAAK,aAAa,CAAC,KAAK,WACtBA;AAAA;AAAA,qBAES,KAAK,SAAS;AAAA,0DACuB,KAAK,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKtD,KAAK,OAAO;AAAA;AAAA,gBAGlB,IAAI;AAAA;AAAA;AAAA,EAGd;AACF;AAtJaF,EA8BJ,SAAS,CAACF,CAAa;AA1BMK,EAAA;AAAA,EAAnCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAJfJ,EAIyB,WAAA,WAAA,CAAA;AAKAG,EAAA;AAAA,EAAnCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GATfJ,EASyB,WAAA,aAAA,CAAA;AAKCG,EAAA;AAAA,EAApCC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GAdhBJ,EAc0B,WAAA,YAAA,CAAA;AAKDG,EAAA;AAAA,EAAnCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAnBfJ,EAmByB,WAAA,SAAA,CAAA;AAKnBG,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAxBIL,EAwBM,WAAA,aAAA,CAAA;AAxBNA,IAANG,EAAA;AAAA,EADNG,EAAc,YAAY;AAAA,GACdN,CAAA;"}

package/dist/components/tree.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tree.js","sources":["../../source/components/tree/tree.style.ts","../../source/components/tree/tree.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const treeStyles = css`\n  /* Base styles */\n  :host {\n    display: block;\n  }\n\n  .tree {\n    font-family: var(--bp-font-family);\n    font-size: var(--bp-font-size-base);\n    color: var(--bp-color-text);\n  }\n\n  /* Node structure */\n  .node {\n    position: relative;\n  }\n\n  .node-content {\n    display: flex;\n    align-items: center;\n    gap: var(--bp-spacing-2);\n    padding: var(--bp-spacing-2) var(--bp-spacing-3);\n    padding-left: calc(\n      var(--bp-spacing-3) + var(--node-level, 0) * var(--bp-spacing-5)\n    );\n    border-radius: var(--bp-border-radius-sm);\n    cursor: pointer;\n    user-select: none;\n    transition:\n      background-color var(--bp-transition-fast),\n      color var(--bp-transition-fast);\n  }\n\n  .node-content:hover {\n    background-color: var(--bp-color-surface-subdued);\n  }\n\n  .node-content:focus {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n  }\n\n  .node-content:focus:not(:focus-visible) {\n    outline: none;\n  }\n\n  .node-content:focus-visible {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n  }\n\n  /* Selected state */\n  .node-content--selected {\n    background-color: oklch(from var(--bp-color-primary) l c h / 0.15);\n    color: var(--bp-color-primary);\n  }\n\n  .node-content--selected:hover {\n    background-color: oklch(from var(--bp-color-primary) l c h / 0.2);\n  }\n\n  /* Active state */\n  .node-content:active {\n    background-color: var(--bp-color-surface-subdued);\n    transform: translateY(1px);\n  }\n\n  .node-content--selected:active {\n    background-color: oklch(from var(--bp-color-primary) l c h / 0.25);\n  }\n\n  /* Toggle icon */\n  .node-toggle {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--bp-spacing-5);\n    height: var(--bp-spacing-5);\n    flex-shrink: 0;\n    visibility: hidden;\n  }\n\n  .node-toggle--visible {\n    visibility: visible;\n  }\n\n  .node-toggle--visible:hover {\n    background-color: var(--bp-color-surface-subdued);\n    border-radius: var(--bp-border-radius-sm);\n  }\n\n  .toggle-icon {\n    width: var(--bp-spacing-4);\n    height: var(--bp-spacing-4);\n    transition: transform var(--bp-transition-fast) ease-out;\n  }\n\n  .toggle-icon--expanded {\n    transform: rotate(90deg);\n  }\n\n  /* Node custom icon */\n  .node-icon {\n    flex-shrink: 0;\n    color: var(--bp-color-text-muted);\n  }\n\n  /* Node label */\n  .node-label {\n    flex: 1;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  /* Children container */\n  .node-children {\n    position: relative;\n    content-visibility: auto;\n    contain-intrinsic-size: auto 200px;\n  }\n\n  /* Expanded state visual cue */\n  .node--expanded > .node-content {\n    background-color: var(--bp-color-surface);\n  }\n\n  /* Disabled state */\n  .node--disabled .node-content {\n    cursor: not-allowed;\n  }\n\n  .node--disabled .node-label {\n    opacity: var(--bp-opacity-disabled);\n  }\n\n  .node--disabled .node-content:hover {\n    background-color: transparent;\n  }\n\n  /* Show lines variant */\n  .tree--lines .node-children {\n    margin-left: calc(var(--bp-spacing-4) + var(--bp-spacing-4));\n    padding-left: var(--bp-spacing-4);\n    border-left: var(--bp-border-width) solid var(--bp-color-border);\n  }\n\n  /* Sizes */\n  .tree--sm {\n    font-size: var(--bp-font-size-sm);\n  }\n\n  .tree--sm .node-content {\n    padding: var(--bp-spacing-1) var(--bp-spacing-2);\n    padding-left: calc(\n      var(--bp-spacing-2) + var(--node-level, 0) * var(--bp-spacing-4)\n    );\n  }\n\n  .tree--sm .node-toggle {\n    width: var(--bp-spacing-4);\n    height: var(--bp-spacing-4);\n  }\n\n  .tree--sm .toggle-icon {\n    width: var(--bp-spacing-3);\n    height: var(--bp-spacing-3);\n  }\n\n  .tree--lg {\n    font-size: var(--bp-font-size-lg);\n  }\n\n  .tree--lg .node-content {\n    padding: var(--bp-spacing-3) var(--bp-spacing-4);\n    padding-left: calc(\n      var(--bp-spacing-4) + var(--node-level, 0) * var(--bp-spacing-6)\n    );\n  }\n\n  .tree--lg .node-toggle {\n    width: var(--bp-spacing-6);\n    height: var(--bp-spacing-6);\n  }\n\n  .tree--lg .toggle-icon {\n    width: var(--bp-spacing-5);\n    height: var(--bp-spacing-5);\n  }\n\n  /* Link nodes — reset anchor styles so links look like regular nodes */\n  a.node-content {\n    text-decoration: none;\n    color: inherit;\n  }\n\n  a.node-content:visited {\n    color: inherit;\n  }\n\n  /* Reduced motion */\n  @media (prefers-reduced-motion: reduce) {\n    .node-content,\n    .toggle-icon {\n      transition: none;\n    }\n\n    .node-content:active {\n      transform: none;\n    }\n  }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { treeStyles } from './tree.style.js';\nimport { memoizeOne } from '../../utilities/memoize.js';\nimport { chevronRightSvg } from '../icon/icons/entries/chevron-right.js';\nimport '../icon/icon.js';\n\n/**\n * Tree node data structure\n */\nexport interface TreeNode {\n  /** Unique identifier for the node */\n  id: string;\n  /** Display label */\n  label: string;\n  /** Optional icon name */\n  icon?: string;\n  /** URL to navigate to when the node is clicked */\n  href?: string;\n  /** Child nodes */\n  children?: TreeNode[];\n  /** Whether the node is disabled */\n  disabled?: boolean;\n  /** Custom data attached to the node */\n  data?: unknown;\n}\n\n/**\n * A hierarchical tree component for displaying nested data structures.\n *\n * @fires bp-select - Fired when a node is selected. Detail: { node: TreeNode, path: string[] }\n * @fires bp-expand - Fired when a node is expanded. Detail: { node: TreeNode, expanded: boolean }\n * @fires bp-collapse - Fired when a node is collapsed. Detail: { node: TreeNode, expanded: boolean }\n * @fires bp-navigate - Fired when a node with href is clicked. Detail: { node: TreeNode, href: string, path: string[] }. Call preventDefault() to handle navigation yourself.\n *\n * @slot - Default slot for custom tree items (when not using data prop)\n *\n * @csspart tree - The tree container\n * @csspart node - Individual tree nodes\n * @csspart node-content - The clickable content area of a node\n * @csspart node-icon - The expand/collapse icon\n * @csspart node-label - The node label text\n * @csspart node-children - Container for child nodes\n */\n@customElement('bp-tree')\nexport class BpTree extends LitElement {\n  /** Array of tree nodes to render */\n  @property({ type: Array }) declare nodes: TreeNode[];\n\n  /** Currently selected node ID */\n  @property({ type: String, reflect: true }) declare selectedId: string | null;\n\n  /** Array of expanded node IDs */\n  @property({ type: Array }) declare expandedIds: string[];\n\n  /** Whether multiple nodes can be selected */\n  @property({ type: Boolean, reflect: true, attribute: 'multi-select' })\n  declare multiSelect: boolean;\n\n  /** Whether to show connecting lines between nodes */\n  @property({ type: Boolean, reflect: true, attribute: 'show-lines' })\n  declare showLines: boolean;\n\n  /** Whether nodes can be selected */\n  @property({ type: Boolean, reflect: true }) declare selectable: boolean;\n\n  /** Size variant */\n  @property({\n    type: String,\n    reflect: true,\n    converter: {\n      fromAttribute: (value: string | null) => {\n        const valid = ['sm', 'md', 'lg'];\n        return value && valid.includes(value) ? value : 'md';\n      },\n    },\n  })\n  declare size: 'sm' | 'md' | 'lg';\n\n  /** Selected node IDs when multiSelect is true */\n  @state() private selectedIds: string[] = [];\n\n  /**\n   * Memoized computation of expanded IDs as a Set for O(1) lookups.\n   * Only recomputes when expandedIds reference changes.\n   */\n  private computeExpandedSet = memoizeOne(\n    (expandedIds: string[]): Set<string> => new Set(expandedIds)\n  );\n\n  /**\n   * Get the memoized expanded set for fast lookups during rendering.\n   */\n  private get expandedSet(): Set<string> {\n    return this.computeExpandedSet(this.expandedIds);\n  }\n\n  static styles = [treeStyles];\n\n  constructor() {\n    super();\n    this.nodes = [];\n    this.selectedId = null;\n    this.expandedIds = [];\n    this.multiSelect = false;\n    this.showLines = false;\n    this.selectable = true;\n    this.size = 'md';\n  }\n\n  /**\n   * Expand a node by ID.\n   * Adds the node to expandedIds and dispatches bp-expand event.\n   *\n   * @param nodeId - The ID of the node to expand\n   */\n  expand(nodeId: string): void {\n    if (!this.expandedSet.has(nodeId)) {\n      this.expandedIds = [...this.expandedIds, nodeId];\n      const node = this.findNode(nodeId, this.nodes);\n      if (node) {\n        this.dispatchEvent(\n          new CustomEvent('bp-expand', {\n            detail: { node, expanded: true },\n            bubbles: true,\n            composed: true,\n          })\n        );\n      }\n    }\n  }\n\n  /**\n   * Collapse a node by ID.\n   * Removes the node from expandedIds and dispatches bp-collapse event.\n   *\n   * @param nodeId - The ID of the node to collapse\n   */\n  collapse(nodeId: string): void {\n    if (this.expandedSet.has(nodeId)) {\n      this.expandedIds = this.expandedIds.filter((id) => id !== nodeId);\n      const node = this.findNode(nodeId, this.nodes);\n      if (node) {\n        this.dispatchEvent(\n          new CustomEvent('bp-collapse', {\n            detail: { node, expanded: false },\n            bubbles: true,\n            composed: true,\n          })\n        );\n      }\n    }\n  }\n\n  /**\n   * Toggle a node's expanded state.\n   * Calls expand() if collapsed, collapse() if expanded.\n   *\n   * @param nodeId - The ID of the node to toggle\n   */\n  toggle(nodeId: string): void {\n    if (this.expandedSet.has(nodeId)) {\n      this.collapse(nodeId);\n    } else {\n      this.expand(nodeId);\n    }\n  }\n\n  /**\n   * Expand all nodes in the tree.\n   * Sets expandedIds to include all nodes with children.\n   */\n  expandAll(): void {\n    const allIds = this.getAllNodeIds(this.nodes);\n    this.expandedIds = allIds;\n  }\n\n  /**\n   * Collapse all nodes in the tree.\n   * Clears the expandedIds array.\n   */\n  collapseAll(): void {\n    this.expandedIds = [];\n  }\n\n  /**\n   * Select a node by ID.\n   * Respects multiSelect setting and disabled state.\n   * Dispatches bp-select event with node, selectedIds, and path.\n   *\n   * @param nodeId - The ID of the node to select\n   */\n  selectNode(nodeId: string): void {\n    const node = this.findNode(nodeId, this.nodes);\n    if (!node || node.disabled) return;\n\n    if (this.multiSelect) {\n      if (this.selectedIds.includes(nodeId)) {\n        this.selectedIds = this.selectedIds.filter((id) => id !== nodeId);\n      } else {\n        this.selectedIds = [...this.selectedIds, nodeId];\n      }\n    } else {\n      this.selectedId = nodeId;\n    }\n\n    this.dispatchEvent(\n      new CustomEvent('bp-select', {\n        detail: {\n          node,\n          selectedIds: this.multiSelect ? this.selectedIds : [nodeId],\n          path: this.getNodePath(nodeId, this.nodes),\n        },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  /**\n   * Clear all selections.\n   * Resets both selectedId and selectedIds.\n   */\n  clearSelection(): void {\n    this.selectedId = null;\n    this.selectedIds = [];\n  }\n\n  /**\n   * Recursively finds a node by ID in the tree structure.\n   *\n   * @param nodeId - The ID to search for\n   * @param nodes - The array of nodes to search within\n   * @returns The found node or null if not found\n   */\n  private findNode(nodeId: string, nodes: TreeNode[]): TreeNode | null {\n    for (const node of nodes) {\n      if (node.id === nodeId) return node;\n      if (node.children) {\n        const found = this.findNode(nodeId, node.children);\n        if (found) return found;\n      }\n    }\n    return null;\n  }\n\n  /**\n   * Recursively collects all node IDs that have children.\n   * Used for expandAll functionality.\n   *\n   * @param nodes - The array of nodes to collect IDs from\n   * @returns Array of node IDs that have children\n   */\n  private getAllNodeIds(nodes: TreeNode[]): string[] {\n    const ids: string[] = [];\n    for (const node of nodes) {\n      if (node.children && node.children.length > 0) {\n        ids.push(node.id);\n        ids.push(...this.getAllNodeIds(node.children));\n      }\n    }\n    return ids;\n  }\n\n  /**\n   * Gets the path from root to a specific node.\n   * Returns an array of node IDs representing the path.\n   *\n   * @param nodeId - The target node ID\n   * @param nodes - The array of nodes to search within\n   * @param path - Accumulator for the current path (used in recursion)\n   * @returns Array of node IDs from root to target\n   */\n  private getNodePath(\n    nodeId: string,\n    nodes: TreeNode[],\n    path: string[] = []\n  ): string[] {\n    for (const node of nodes) {\n      if (node.id === nodeId) {\n        return [...path, node.id];\n      }\n      if (node.children) {\n        const foundPath = this.getNodePath(nodeId, node.children, [\n          ...path,\n          node.id,\n        ]);\n        if (foundPath.length > path.length + 1) {\n          return foundPath;\n        }\n      }\n    }\n    return path;\n  }\n\n  /**\n   * Handles click events on tree nodes.\n   * For nodes with href, dispatches bp-navigate and follows the link unless prevented.\n   * For other nodes, selects the node if selectable and not disabled.\n   *\n   * @param event - The click event\n   * @param node - The node that was clicked\n   */\n  private handleNodeClick(event: Event, node: TreeNode): void {\n    event.stopPropagation();\n\n    if (node.href && !node.disabled) {\n      const navigateEvent = new CustomEvent('bp-navigate', {\n        detail: {\n          node,\n          href: node.href,\n          path: this.getNodePath(node.id, this.nodes),\n        },\n        bubbles: true,\n        composed: true,\n        cancelable: true,\n      });\n      const allowed = this.dispatchEvent(navigateEvent);\n      if (allowed) {\n        // Default navigation — let the <a> handle it naturally\n        return;\n      }\n      // Consumer called preventDefault(); suppress default link behavior\n      event.preventDefault();\n      return;\n    }\n\n    if (this.selectable && !node.disabled) {\n      this.selectNode(node.id);\n    }\n  }\n\n  /**\n   * Handles click events on the expand/collapse toggle icon.\n   * Prevents event propagation to avoid triggering node selection.\n   *\n   * @param event - The click event\n   * @param node - The node whose toggle was clicked\n   */\n  private handleToggleClick(event: Event, node: TreeNode): void {\n    event.stopPropagation();\n    event.preventDefault();\n    this.toggle(node.id);\n  }\n\n  /**\n   * Handles keyboard navigation on tree nodes.\n   * Enter/Space: select node\n   * ArrowRight: expand node (if has children and collapsed)\n   * ArrowLeft: collapse node (if has children and expanded)\n   *\n   * @param event - The keyboard event\n   * @param node - The node that received the keyboard event\n   */\n  private handleKeyDown(event: KeyboardEvent, node: TreeNode): void {\n    const hasChildren = node.children && node.children.length > 0;\n    const isExpanded = this.expandedSet.has(node.id);\n\n    switch (event.key) {\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        if (node.href && !node.disabled) {\n          this.handleNodeClick(event, node);\n        } else if (this.selectable && !node.disabled) {\n          this.selectNode(node.id);\n        }\n        break;\n      case 'ArrowRight':\n        event.preventDefault();\n        if (hasChildren && !isExpanded) {\n          this.expand(node.id);\n        }\n        break;\n      case 'ArrowLeft':\n        event.preventDefault();\n        if (hasChildren && isExpanded) {\n          this.collapse(node.id);\n        }\n        break;\n    }\n  }\n\n  /**\n   * Checks if a node is currently selected.\n   * Handles both single and multi-select modes.\n   *\n   * @param nodeId - The node ID to check\n   * @returns True if the node is selected\n   */\n  private isSelected(nodeId: string): boolean {\n    if (this.multiSelect) {\n      return this.selectedIds.includes(nodeId);\n    }\n    return this.selectedId === nodeId;\n  }\n\n  /**\n   * Recursively renders a tree node and its children.\n   * Handles expand/collapse state, selection, and disabled state.\n   *\n   * @param node - The node to render\n   * @param level - The nesting level (0 for root)\n   * @returns Lit template result\n   */\n  private renderNode(node: TreeNode, level: number = 0): unknown {\n    const hasChildren = node.children && node.children.length > 0;\n    const isExpanded = this.expandedSet.has(node.id);\n    const isSelected = this.isSelected(node.id);\n\n    const contentClasses = `node-content ${isSelected ? 'node-content--selected' : ''} ${node.href ? 'node-content--link' : ''}`;\n\n    const contentInner = html`\n      <span\n        class=\"node-toggle ${hasChildren ? 'node-toggle--visible' : ''}\"\n        part=\"node-icon\"\n        @click=${(e: Event) => this.handleToggleClick(e, node)}\n      >\n        ${hasChildren\n          ? html`<bp-icon\n              class=\"toggle-icon ${isExpanded ? 'toggle-icon--expanded' : ''}\"\n              .svg=${chevronRightSvg}\n              size=\"sm\"\n            ></bp-icon>`\n          : nothing}\n      </span>\n      ${node.icon\n        ? html`<bp-icon\n            class=\"node-icon\"\n            part=\"node-custom-icon\"\n            name=${node.icon}\n            size=\"sm\"\n          ></bp-icon>`\n        : nothing}\n      <span class=\"node-label\" part=\"node-label\">${node.label}</span>\n    `;\n\n    const nodeContent = node.href\n      ? html`\n          <a\n            class=${contentClasses}\n            part=\"node-content\"\n            href=${node.href}\n            tabindex=${node.disabled ? -1 : 0}\n            @click=${(e: Event) => this.handleNodeClick(e, node)}\n            @keydown=${(e: KeyboardEvent) => this.handleKeyDown(e, node)}\n          >\n            ${contentInner}\n          </a>\n        `\n      : html`\n          <div\n            class=${contentClasses}\n            part=\"node-content\"\n            tabindex=${node.disabled ? -1 : 0}\n            @click=${(e: Event) => this.handleNodeClick(e, node)}\n            @keydown=${(e: KeyboardEvent) => this.handleKeyDown(e, node)}\n          >\n            ${contentInner}\n          </div>\n        `;\n\n    return html`\n      <div\n        class=\"node ${node.disabled ? 'node--disabled' : ''} ${hasChildren &&\n        isExpanded\n          ? 'node--expanded'\n          : ''}\"\n        part=\"node\"\n        role=\"treeitem\"\n        aria-expanded=${ifDefined(\n          hasChildren ? (isExpanded ? 'true' : 'false') : undefined\n        )}\n        aria-selected=${ifDefined(\n          this.selectable ? (isSelected ? 'true' : 'false') : undefined\n        )}\n        aria-disabled=${ifDefined(node.disabled ? 'true' : undefined)}\n        style=\"--node-level: ${level}\"\n      >\n        ${nodeContent}\n        ${hasChildren && isExpanded\n          ? html`\n              <div class=\"node-children\" part=\"node-children\" role=\"group\">\n                ${repeat(\n                  node.children!,\n                  (child) => child.id,\n                  (child) => this.renderNode(child, level + 1)\n                )}\n              </div>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n\n  render() {\n    const hasNodes = this.nodes && this.nodes.length > 0;\n\n    return html`\n      <div\n        class=\"tree tree--${this.size} ${this.showLines ? 'tree--lines' : ''}\"\n        part=\"tree\"\n        role=\"tree\"\n        aria-multiselectable=${ifDefined(this.multiSelect ? 'true' : undefined)}\n      >\n        ${hasNodes\n          ? repeat(\n              this.nodes,\n              (node) => node.id,\n              (node) => this.renderNode(node, 0)\n            )\n          : html`<slot></slot>`}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-tree': BpTree;\n  }\n}\n"],"names":["treeStyles","css","BpTree","LitElement","memoizeOne","expandedIds","nodeId","node","id","allIds","nodes","found","ids","path","foundPath","event","navigateEvent","hasChildren","isExpanded","level","isSelected","contentClasses","contentInner","html","e","chevronRightSvg","nothing","nodeContent","ifDefined","repeat","child","hasNodes","__decorateClass","property","value","state","customElement"],"mappings":"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"}

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/shared/boolean-converter-XDGfS9LC.js

@@ -1,12 +0,0 @@
-const r = {
-  fromAttribute(t) {
-    return t === null ? !0 : t.toLowerCase() !== "false";
-  },
-  toAttribute(t) {
-    return t ? "" : "false";
-  }
-};
-export {
-  r as b
-};
-//# sourceMappingURL=boolean-converter-XDGfS9LC.js.map

package/dist/shared/boolean-converter-XDGfS9LC.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"boolean-converter-XDGfS9LC.js","sources":["../../source/utilities/boolean-converter.ts"],"sourcesContent":["import type { ComplexAttributeConverter } from 'lit';\n\n/**\n * A custom Lit attribute converter for boolean properties that default to `true`.\n *\n * Lit's built-in `type: Boolean` follows native HTML boolean attribute semantics:\n * any attribute presence (even `=\"false\"`) is treated as `true`. This converter\n * instead parses the attribute value so `=\"false\"` correctly sets the property\n * to `false`.\n *\n * Behavior:\n * - Attribute absent → `null` (property uses its default)\n * - `attribute=\"\"` or `attribute` (no value) → `true`\n * - `attribute=\"false\"` → `false`\n * - `attribute=\"true\"` or any other value → `true`\n *\n * Usage:\n * ```ts\n * @property({ converter: booleanConverter, reflect: true })\n * declare showBackdrop: boolean;\n * ```\n */\nexport const booleanConverter: ComplexAttributeConverter<boolean> = {\n  fromAttribute(value: string | null): boolean {\n    if (value === null) {\n      return true;\n    }\n    return value.toLowerCase() !== 'false';\n  },\n  toAttribute(value: boolean): string | null {\n    return value ? '' : 'false';\n  },\n};\n"],"names":["booleanConverter","value"],"mappings":"AAsBO,MAAMA,IAAuD;AAAA,EAClE,cAAcC,GAA+B;AAC3C,WAAIA,MAAU,OACL,KAEFA,EAAM,kBAAkB;AAAA,EACjC;AAAA,EACA,YAAYA,GAA+B;AACzC,WAAOA,IAAQ,KAAK;AAAA,EACtB;AACF;"}

package/dist/shared/debounce-BckY30Sf.js

@@ -1,23 +0,0 @@
-function c(t, i) {
-  let l = null, n = null;
-  const u = (...e) => {
-    n = e, l !== null && clearTimeout(l), l = setTimeout(() => {
-      if (l = null, n !== null) {
-        const o = n;
-        n = null, t(...o);
-      }
-    }, i);
-  };
-  return u.cancel = () => {
-    l !== null && (clearTimeout(l), l = null), n = null;
-  }, u.flush = () => {
-    if (l !== null && (clearTimeout(l), l = null), n !== null) {
-      const e = n;
-      n = null, t(...e);
-    }
-  }, u;
-}
-export {
-  c as d
-};
-//# sourceMappingURL=debounce-BckY30Sf.js.map

package/dist/shared/debounce-BckY30Sf.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"debounce-BckY30Sf.js","sources":["../../source/utilities/debounce.ts"],"sourcesContent":["/**\n * Debounce utility for delaying function execution until after a period of inactivity.\n * Trailing-edge by default: fires after the delay has elapsed since the last call.\n */\n\ntype DebouncedFunction<T extends (...args: never[]) => unknown> = {\n  (...args: Parameters<T>): void;\n  cancel: () => void;\n  flush: () => void;\n};\n\nexport function debounce<T extends (...args: never[]) => unknown>(\n  fn: T,\n  delay: number\n): DebouncedFunction<T> {\n  let timeoutId: ReturnType<typeof setTimeout> | null = null;\n  let pendingArgs: Parameters<T> | null = null;\n\n  const debounced = (...args: Parameters<T>): void => {\n    pendingArgs = args;\n\n    if (timeoutId !== null) {\n      clearTimeout(timeoutId);\n    }\n\n    timeoutId = setTimeout(() => {\n      timeoutId = null;\n      if (pendingArgs !== null) {\n        const args = pendingArgs;\n        pendingArgs = null;\n        fn(...args);\n      }\n    }, delay);\n  };\n\n  debounced.cancel = () => {\n    if (timeoutId !== null) {\n      clearTimeout(timeoutId);\n      timeoutId = null;\n    }\n    pendingArgs = null;\n  };\n\n  debounced.flush = () => {\n    if (timeoutId !== null) {\n      clearTimeout(timeoutId);\n      timeoutId = null;\n    }\n    if (pendingArgs !== null) {\n      const args = pendingArgs;\n      pendingArgs = null;\n      fn(...args);\n    }\n  };\n\n  return debounced;\n}\n"],"names":["debounce","fn","delay","timeoutId","pendingArgs","debounced","args"],"mappings":"AAWO,SAASA,EACdC,GACAC,GACsB;AACtB,MAAIC,IAAkD,MAClDC,IAAoC;AAExC,QAAMC,IAAY,IAAIC,MAA8B;AAClD,IAAAF,IAAcE,GAEVH,MAAc,QAChB,aAAaA,CAAS,GAGxBA,IAAY,WAAW,MAAM;AAE3B,UADAA,IAAY,MACRC,MAAgB,MAAM;AACxB,cAAME,IAAOF;AACb,QAAAA,IAAc,MACdH,EAAG,GAAGK,CAAI;AAAA,MACZ;AAAA,IACF,GAAGJ,CAAK;AAAA,EACV;AAEA,SAAAG,EAAU,SAAS,MAAM;AACvB,IAAIF,MAAc,SAChB,aAAaA,CAAS,GACtBA,IAAY,OAEdC,IAAc;AAAA,EAChB,GAEAC,EAAU,QAAQ,MAAM;AAKtB,QAJIF,MAAc,SAChB,aAAaA,CAAS,GACtBA,IAAY,OAEVC,MAAgB,MAAM;AACxB,YAAME,IAAOF;AACb,MAAAA,IAAc,MACdH,EAAG,GAAGK,CAAI;AAAA,IACZ;AAAA,EACF,GAEOD;AACT;"}

package/dist/shared/memoize-DlOFy-92.js

@@ -1,16 +0,0 @@
-function i(t) {
-  let l, e, r = !1;
-  return (...n) => (r && u(l, n) || (l = n, e = t(...n), r = !0), e);
-}
-function u(t, l) {
-  if (t.length !== l.length)
-    return !1;
-  for (let e = 0; e < t.length; e++)
-    if (t[e] !== l[e])
-      return !1;
-  return !0;
-}
-export {
-  i as m
-};
-//# sourceMappingURL=memoize-DlOFy-92.js.map

package/dist/shared/memoize-DlOFy-92.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"memoize-DlOFy-92.js","sources":["../../source/utilities/memoize.ts"],"sourcesContent":["/**\n * Single-result memoization utility.\n * Caches the last call's arguments and result using shallow equality comparison.\n * Ideal for willUpdate() patterns where you memoize based on reactive properties.\n */\n\nexport function memoizeOne<T extends (...args: never[]) => unknown>(fn: T): T {\n  let lastArgs: Parameters<T> | undefined;\n  let lastResult: ReturnType<T>;\n  let hasBeenCalled = false;\n\n  const memoized = (...args: Parameters<T>): ReturnType<T> => {\n    if (hasBeenCalled && argsMatch(lastArgs!, args)) {\n      return lastResult;\n    }\n\n    lastArgs = args;\n    lastResult = fn(...args) as ReturnType<T>;\n    hasBeenCalled = true;\n    return lastResult;\n  };\n\n  return memoized as T;\n}\n\nfunction argsMatch(prev: unknown[], next: unknown[]): boolean {\n  if (prev.length !== next.length) {\n    return false;\n  }\n\n  for (let i = 0; i < prev.length; i++) {\n    if (prev[i] !== next[i]) {\n      return false;\n    }\n  }\n\n  return true;\n}\n"],"names":["memoizeOne","fn","lastArgs","lastResult","hasBeenCalled","args","argsMatch","prev","next","i"],"mappings":"AAMO,SAASA,EAAoDC,GAAU;AAC5E,MAAIC,GACAC,GACAC,IAAgB;AAapB,SAXiB,IAAIC,OACfD,KAAiBE,EAAUJ,GAAWG,CAAI,MAI9CH,IAAWG,GACXF,IAAaF,EAAG,GAAGI,CAAI,GACvBD,IAAgB,KACTD;AAIX;AAEA,SAASG,EAAUC,GAAiBC,GAA0B;AAC5D,MAAID,EAAK,WAAWC,EAAK;AACvB,WAAO;AAGT,WAASC,IAAI,GAAGA,IAAIF,EAAK,QAAQE;AAC/B,QAAIF,EAAKE,CAAC,MAAMD,EAAKC,CAAC;AACpB,aAAO;AAIX,SAAO;AACT;"}