@pine-ds/core 3.7.0 → 3.8.0

package/dist/pine-core/p-0075bbbe.system.entry.js

@@ -1,2 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(t,i,r,e){function n(t){return t instanceof r?t:new r((function(i){i(t)}))}return new(r||(r=Promise))((function(r,o){function s(t){try{l(e.next(t))}catch(t){o(t)}}function a(t){try{l(e["throw"](t))}catch(t){o(t)}}function l(t){t.done?r(t.value):n(t.value).then(s,a)}l((e=e.apply(t,i||[])).next())}))};var __generator=this&&this.__generator||function(t,i){var r={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},e,n,o,s;return s={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function a(t){return function(i){return l([t,i])}}function l(a){if(e)throw new TypeError("Generator is already executing.");while(s&&(s=0,a[0]&&(r=0)),r)try{if(e=1,n&&(o=a[0]&2?n["return"]:a[0]?n["throw"]||((o=n["return"])&&o.call(n),0):n.next)&&!(o=o.call(n,a[1])).done)return o;if(n=0,o)a=[a[0]&2,o.value];switch(a[0]){case 0:case 1:o=a;break;case 4:r.label++;return{value:a[1],done:false};case 5:r.label++;n=a[1];a=[0];continue;case 7:a=r.ops.pop();r.trys.pop();continue;default:if(!(o=r.trys,o=o.length>0&&o[o.length-1])&&(a[0]===6||a[0]===2)){r=0;continue}if(a[0]===3&&(!o||a[1]>o[0]&&a[1]<o[3])){r.label=a[1];break}if(a[0]===6&&r.label<o[1]){r.label=o[1];o=a;break}if(o&&r.label<o[2]){r.label=o[2];r.ops.push(a);break}if(o[2])r.ops.pop();r.trys.pop();continue}a=i.call(t,r)}catch(t){a=[6,t];n=0}finally{e=o=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};System.register(["./p-Cxvdulqq.system.js"],(function(t){"use strict";var i,r,e,n,o;return{setters:[function(t){i=t.r;r=t.c;e=t.h;n=t.H;o=t.g}],execute:function(){var s='@charset "UTF-8";:host{--color-background-default:var(--pine-color-white);background:var(--color-background-default);border-collapse:separate;border-radius:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;display:table;width:100%}:host(:focus-visible){outline:var(--pine-outline-focus)}:host(.pds-table-responsive-host){border-radius:inherit;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;display:block !important;max-width:100% !important;overflow:hidden !important;position:relative !important;width:100% !important}.pds-table-responsive-container{border-radius:inherit;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;overflow-x:auto !important;overflow-y:visible !important;position:relative !important;width:100% !important}.pds-table-responsive-wrapper{border-radius:inherit;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;display:block !important;position:relative !important;width:100% !important}.pds-table-responsive-wrapper .pds-table{display:table !important;min-width:-webkit-max-content !important;min-width:-moz-max-content !important;min-width:max-content !important;table-layout:auto !important;white-space:nowrap !important;width:100% !important}.scroll-shadow-left,.scroll-shadow-right{height:100%;opacity:0;pointer-events:none;position:absolute;top:0;-webkit-transition:opacity 0.1s ease;transition:opacity 0.1s ease;width:4px;z-index:10}.scroll-shadow-left{background:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.1)), to(transparent));background:linear-gradient(to right, rgba(0, 0, 0, 0.1), transparent);border-bottom-left-radius:inherit;border-top-left-radius:inherit;left:0}.scroll-shadow-right{background:-webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.1)), to(transparent));background:linear-gradient(to left, rgba(0, 0, 0, 0.1), transparent);border-bottom-right-radius:inherit;border-top-right-radius:inherit;right:0}';var a=t("pds_table",function(){function t(t){i(this,t);this.pdsTableSelect=r(this,"pdsTableSelect");this.pdsTableSelectAll=r(this,"pdsTableSelectAll");this.scrollContainer=null;this._responsiveHandleScroll=null;this._responsiveHandleResize=null;this._responsiveResizeObserver=null;this._teardownResponsive=null;this.sortingColumn=null;this.sortingDirection="asc"}t.prototype.componentWillLoad=function(){this.sortingColumn=null};t.prototype.componentDidLoad=function(){if(this.responsive){this.setupResponsiveScrolling()}};t.prototype.disconnectedCallback=function(){if(this._teardownResponsive){this._teardownResponsive();this._teardownResponsive=null}};t.prototype.setupResponsiveScrolling=function(){var t=this;var i,r,e;var n=(i=this.el.shadowRoot)===null||i===void 0?void 0:i.querySelector(".pds-table-responsive-container");var o=(r=this.el.shadowRoot)===null||r===void 0?void 0:r.querySelector(".scroll-shadow-left");var s=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector(".scroll-shadow-right");if(!n||!o||!s)return;this.scrollContainer=n;this._responsiveHandleScroll=function(){if(!t.scrollContainer)return;var i=t.scrollContainer.scrollLeft;var r=t.scrollContainer.scrollWidth-t.scrollContainer.clientWidth;o.style.opacity=i>0&&!t.fixedColumn?"1":"0";s.style.opacity=r>0&&i<r-1?"1":"0"};this.scrollContainer.addEventListener("scroll",this._responsiveHandleScroll,{passive:true});if(typeof window!=="undefined"&&window.ResizeObserver){try{this._responsiveResizeObserver=new ResizeObserver((function(){var i;(i=t._responsiveHandleScroll)===null||i===void 0?void 0:i.call(t)}));this._responsiveResizeObserver.observe(this.scrollContainer)}catch(t){}}if(typeof window!=="undefined"){this._responsiveHandleResize=function(){var i;(i=t._responsiveHandleScroll)===null||i===void 0?void 0:i.call(t)};window.addEventListener("resize",this._responsiveHandleResize)}this._teardownResponsive=function(){if(t.scrollContainer&&t._responsiveHandleScroll){t.scrollContainer.removeEventListener("scroll",t._responsiveHandleScroll);t.scrollContainer=null}if(t._responsiveResizeObserver){t._responsiveResizeObserver.disconnect();t._responsiveResizeObserver=null}if(typeof window!=="undefined"&&t._responsiveHandleResize){window.removeEventListener("resize",t._responsiveHandleResize);t._responsiveHandleResize=null}t._responsiveHandleScroll=null};this._responsiveHandleScroll()};t.prototype.classNames=function(){var t=["pds-table"];if(this.compact){t.push("is-compact")}if(this.responsive){t.push("is-responsive")}return t.join("  ")};t.prototype.sortTable=function(t,i){var r=this.el.querySelector("pds-table-body");var e=Array.from(r.querySelectorAll("pds-table-row"));var n=Array.from(this.el.querySelectorAll("pds-table-head-cell[sortable]"));var o=n.find((function(i){return i.innerText.trim()===t}));if(!o){console.warn('Column "'.concat(t,'" not found.'));return}var s=n.indexOf(o);e.sort((function(t,r){var e=t.querySelector("pds-table-cell:nth-child(".concat(s+1,")")).textContent.trim();var n=r.querySelector("pds-table-cell:nth-child(".concat(s+1,")")).textContent.trim();if(i==="asc"){return e.localeCompare(n,undefined,{sensitivity:"base"})}else{return n.localeCompare(e,undefined,{sensitivity:"base"})}}));r.innerHTML="";e.forEach((function(t){r.appendChild(t)}))};t.prototype.handleTableSort=function(t){var i=t.detail.direction;this.sortTable(t.detail.column,i);this.sortingColumn=t.detail.column;this.sortingDirection=i};t.prototype.handleTableSelectAll=function(t){if(t.defaultPrevented)return;var i=this.el.querySelector("pds-table-body");var r=Array.from(i.querySelectorAll("pds-table-row"));r.forEach((function(i){i.isSelected=t.detail.isSelected}))};t.prototype.handleTableSelect=function(t){return __awaiter(this,void 0,void 0,(function(){var i,r,e,n,o;return __generator(this,(function(s){if(t.defaultPrevented)return[2];i=this.el.querySelectorAll("pds-table-row");r=Array.from(i).every((function(t){return t.isSelected}));e=Array.from(i).every((function(t){return!t.isSelected}));n=this.el.querySelector("pds-table-head");if(!n)return[2];o=n.shadowRoot.querySelector("pds-checkbox");o.checked=r;o.indeterminate=!r&&!e;return[2]}))}))};t.prototype.render=function(){if(this.responsive){return e(n,{class:"pds-table is-responsive pds-table-responsive-host",id:this.componentId,role:"grid",selectable:this.selectable,tabindex:"0",part:"table responsive-table"},e("div",{class:"scroll-shadow-left",part:"scroll-shadow-left"}),e("div",{class:"scroll-shadow-right",part:"scroll-shadow-right"}),e("div",{class:"pds-table-responsive-container",part:"responsive-container"},e("div",{class:"pds-table-responsive-wrapper",part:"responsive-wrapper"},e("div",{class:this.classNames(),part:"table-inner"},e("slot",null)))))}return e(n,{class:this.classNames(),id:this.componentId,role:"grid",selectable:this.selectable,tabindex:"0",part:"table"},e("slot",null))};Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});return t}());a.style=s}}}));
-//# sourceMappingURL=p-0075bbbe.system.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTableCss","PdsTable","exports","class_1","hostRef","this","scrollContainer","_responsiveHandleScroll","_responsiveHandleResize","_responsiveResizeObserver","_teardownResponsive","sortingColumn","sortingDirection","prototype","componentWillLoad","componentDidLoad","responsive","setupResponsiveScrolling","disconnectedCallback","_this","container","_a","el","shadowRoot","querySelector","leftShadow","_b","rightShadow","_c","scrollLeft","maxScrollLeft","scrollWidth","clientWidth","style","opacity","fixedColumn","addEventListener","passive","window","ResizeObserver","call","observe","error","removeEventListener","disconnect","classNames","compact","push","join","sortTable","column","direction","tableBody","tableRows","Array","from","querySelectorAll","columnHeaderCells","columnHeaderCell","find","cell","innerText","trim","console","warn","concat","columnIndex","indexOf","sort","a","b","valueA","textContent","valueB","localeCompare","undefined","sensitivity","innerHTML","forEach","row","appendChild","handleTableSort","event","detail","handleTableSelectAll","defaultPrevented","pdsTableBody","isSelected","handleTableSelect","allTableRows","allSelectedRows","every","noneSelectedRows","pdsTableHead","headerCheckbox","checked","indeterminate","render","h","Host","class","id","componentId","role","selectable","tabindex","part"],"sources":["src/components/pds-table/pds-table.scss?tag=pds-table&encapsulation=shadow","src/components/pds-table/pds-table.tsx"],"sourcesContent":[":host {\n  --color-background-default: var(--pine-color-white);\n\n  background: var(--color-background-default);\n  border-collapse: separate;\n  border-radius: inherit;\n  box-sizing: border-box;\n  display: table;\n  width: 100%;\n}\n\n:host(:focus-visible) {\n  outline: var(--pine-outline-focus);\n}\n\n/*\n * Responsive Table Architecture\n *\n * When responsive=true, the table uses a nested structure to provide horizontal scrolling\n * while maintaining proper width behavior and scroll shadows:\n *\n * Host (.pds-table-responsive-host)\n * ├── Shadow Left (positioned fixed to left edge)\n * ├── Shadow Right (positioned fixed to right edge)\n * └── Container (.pds-table-responsive-container)\n *     └── Wrapper (.pds-table-responsive-wrapper)\n *         └── Table (.pds-table)\n *\n * - Host: Constrains everything to parent width, clips shadows to border-radius\n * - Shadows: Stay fixed during scroll, provide visual scroll indicators\n * - Container: Handles horizontal scrolling (overflow-x: auto)\n * - Table: Expands to full width or scrolls based on content\n */\n:host(.pds-table-responsive-host) {\n  border-radius: inherit;\n  box-sizing: border-box !important;\n  display: block !important;\n  max-width: 100% !important;\n  overflow: hidden !important;\n  position: relative !important;\n  width: 100% !important;\n}\n\n.pds-table-responsive-container {\n  border-radius: inherit;\n  box-sizing: border-box !important;\n  overflow-x: auto !important;\n  overflow-y: visible !important;\n  position: relative !important;\n  width: 100% !important;\n}\n\n.pds-table-responsive-wrapper {\n  border-radius: inherit;\n  box-sizing: border-box !important;\n  display: block !important;\n  position: relative !important;\n  width: 100% !important;\n}\n\n.pds-table-responsive-wrapper .pds-table {\n  display: table !important;\n  min-width: max-content !important;\n  table-layout: auto !important;\n  white-space: nowrap !important;\n  width: 100% !important;\n}\n\n/* Shadows positioned relative to host (non-scrolling), covering container edges */\n.scroll-shadow-left,\n.scroll-shadow-right {\n  height: 100%;\n  opacity: 0;\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  transition: opacity 0.1s ease;\n  width: 4px;\n  z-index: 10;\n}\n\n.scroll-shadow-left {\n  background: linear-gradient(to right, rgba(0, 0, 0, 0.1), transparent);\n  border-bottom-left-radius: inherit;\n  border-top-left-radius: inherit;\n  left: 0;\n}\n\n.scroll-shadow-right {\n  background: linear-gradient(to left, rgba(0, 0, 0, 0.1), transparent);\n  border-bottom-right-radius: inherit;\n  border-top-right-radius: inherit;\n  right: 0;\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop, State, Listen } from '@stencil/core';\n\n@Component({\n  tag: 'pds-table',\n  styleUrls: ['pds-table.scss'],\n  shadow: true,\n})\nexport class PdsTable {\n  @Element() el: HTMLPdsTableElement;\n  private scrollContainer: HTMLElement | null = null;\n  private _responsiveHandleScroll: (() => void) | null = null;\n  private _responsiveHandleResize: (() => void) | null = null;\n  private _responsiveResizeObserver: ResizeObserver | null = null;\n  private _teardownResponsive: (() => void) | null = null;\n\n  /**\n   * Determines if the table displays with reduced table cell padding.\n   */\n  @Prop() compact: boolean;\n\n  /**\n   * A unique identifier used for the table `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Enables the table to be responsive by horizontally scrolling on smaller screens.\n   */\n  @Prop() responsive: boolean;\n\n  /**\n   * Determines if the should display a fixed first column.\n   */\n  @Prop() fixedColumn: boolean;\n\n  /**\n   * Determines if the table displays checkboxes for selectable rows.\n   */\n  @Prop() selectable: boolean;\n\n  /**\n   * The name of the column being sorted.\n   * @defaultValue null\n   */\n  @State() sortingColumn: string | null = null;\n\n  /**\n   * The direction of sorting.\n   * @defaultValue 'asc'\n   */\n  @State() sortingDirection: 'asc' | 'desc' = 'asc';\n\n\n  /**\n   * Event that is emitted when the checkbox is clicked, carrying the rowIndex and selected value.\n   */\n  @Event() pdsTableSelect: EventEmitter<{ rowIndex: number; isSelected: boolean }>;\n\n  /**\n   * Event that is emitted when the select all checkbox is clicked, carrying the selected value.\n   */\n  @Event() pdsTableSelectAll: EventEmitter<{ isSelected: boolean }>;\n\n  componentWillLoad() {\n    this.sortingColumn = null;\n  }\n\n  componentDidLoad() {\n    if (this.responsive) {\n      this.setupResponsiveScrolling();\n    }\n  }\n\n  disconnectedCallback() {\n    if (this._teardownResponsive) {\n      this._teardownResponsive();\n      this._teardownResponsive = null;\n    }\n  }\n\n  /**\n   * Sets up responsive scrolling behavior for the table.\n   *\n   * This method creates a horizontal scrolling system where:\n   * - The table content can scroll horizontally when it exceeds the container width\n   * - Scroll shadows appear at the left/right edges to indicate scrollable content\n   * - Fixed columns remain sticky during horizontal scrolling\n   * - Shadows respect border-radius and don't appear when there's nothing to scroll\n   *\n   * Architecture:\n   * - Host element: Contains everything, respects parent constraints\n   * - Container element: Handles horizontal scrolling (overflow-x: auto)\n   * - Shadow elements: Positioned fixed relative to host, show scroll indicators\n   *\n   * @private\n   */\n  private setupResponsiveScrolling() {\n    const container = this.el.shadowRoot?.querySelector('.pds-table-responsive-container') as HTMLElement;\n    const leftShadow = this.el.shadowRoot?.querySelector('.scroll-shadow-left') as HTMLElement;\n    const rightShadow = this.el.shadowRoot?.querySelector('.scroll-shadow-right') as HTMLElement;\n\n    if (!container || !leftShadow || !rightShadow) return;\n\n    // Store container reference for cleanup\n    this.scrollContainer = container;\n\n    /**\n     * Updates the visibility of scroll shadows based on current scroll position.\n     * Left shadow: Shows when scrolled away from start (hidden if fixedColumn is enabled)\n     * Right shadow: Shows when there's content to scroll and not at the end\n     */\n    this._responsiveHandleScroll = () => {\n      if (!this.scrollContainer) return;\n\n      const scrollLeft = this.scrollContainer.scrollLeft;\n      const maxScrollLeft = this.scrollContainer.scrollWidth - this.scrollContainer.clientWidth;\n\n      // Show left shadow when scrolled away from start, but not if there's a fixed column\n      leftShadow.style.opacity = (scrollLeft > 0 && !this.fixedColumn) ? '1' : '0';\n\n      // Show right shadow only if there's content to scroll AND not at end\n      rightShadow.style.opacity = (maxScrollLeft > 0 && scrollLeft < maxScrollLeft - 1) ? '1' : '0';\n    };\n\n    // Add scroll event listener to container element\n    this.scrollContainer.addEventListener('scroll', this._responsiveHandleScroll, { passive: true });\n\n    // Add resize observer to update shadows when container size changes\n    if (typeof window !== 'undefined' && window.ResizeObserver) {\n      try {\n        this._responsiveResizeObserver = new ResizeObserver(() => {\n          this._responsiveHandleScroll?.();\n        });\n        this._responsiveResizeObserver.observe(this.scrollContainer);\n      } catch (error) {\n        // ResizeObserver not available in some environments (e.g., tests)\n        // Fall back to window resize listener only\n      }\n    }\n\n    // Listen for window resize as fallback\n    if (typeof window !== 'undefined') {\n      this._responsiveHandleResize = () => {\n        this._responsiveHandleScroll?.();\n      };\n      window.addEventListener('resize', this._responsiveHandleResize);\n    }\n\n    // Create teardown function for cleanup\n    this._teardownResponsive = () => {\n      if (this.scrollContainer && this._responsiveHandleScroll) {\n        this.scrollContainer.removeEventListener('scroll', this._responsiveHandleScroll);\n        this.scrollContainer = null;\n      }\n\n      if (this._responsiveResizeObserver) {\n        this._responsiveResizeObserver.disconnect();\n        this._responsiveResizeObserver = null;\n      }\n\n      if (typeof window !== 'undefined' && this._responsiveHandleResize) {\n        window.removeEventListener('resize', this._responsiveHandleResize);\n        this._responsiveHandleResize = null;\n      }\n\n      this._responsiveHandleScroll = null;\n    };\n\n    // Initial check after setup\n    this._responsiveHandleScroll();\n  }\n\n\n  private classNames() {\n    const classNames = ['pds-table'];\n\n    if (this.compact) {\n      classNames.push('is-compact');\n    }\n\n    if (this.responsive) {\n      classNames.push('is-responsive');\n    }\n\n    return classNames.join('  ');\n  }\n\n  private sortTable(column: string, direction: 'asc' | 'desc') {\n    const tableBody = this.el.querySelector('pds-table-body');\n\n    // Get the rows in the table body\n    const tableRows = Array.from(tableBody.querySelectorAll('pds-table-row'));\n\n    // Find the column index based on the column name\n    const columnHeaderCells: HTMLElement[] = Array.from(\n      this.el.querySelectorAll('pds-table-head-cell[sortable]')\n    );\n\n    const columnHeaderCell = columnHeaderCells.find(\n      (cell) => cell.innerText.trim() === column\n    );\n\n    if (!columnHeaderCell) {\n      console.warn(`Column \"${column}\" not found.`);\n      return;\n    }\n\n    const columnIndex = columnHeaderCells.indexOf(columnHeaderCell);\n\n    // Sort the rows based on the content of the specified column\n    tableRows.sort((a, b) => {\n      const valueA = a.querySelector(`pds-table-cell:nth-child(${columnIndex + 1})`).textContent.trim();\n      const valueB = b.querySelector(`pds-table-cell:nth-child(${columnIndex + 1})`).textContent.trim();\n\n      if (direction === 'asc') {\n        return valueA.localeCompare(valueB, undefined, { sensitivity: 'base' });\n      } else {\n        return valueB.localeCompare(valueA, undefined, { sensitivity: 'base' });\n      }\n    });\n\n    // Clear and append the sorted rows back to the table body\n    tableBody.innerHTML = '';\n    tableRows.forEach((row) => {\n      tableBody.appendChild(row);\n    });\n  }\n\n  @Listen('pdsTableSort')\n  handleTableSort(event: CustomEvent<{ column: string; direction: 'asc' | 'desc' }>) {\n    const { direction } = event.detail;\n    this.sortTable(event.detail.column, direction);\n    this.sortingColumn = event.detail.column;\n    this.sortingDirection = direction;\n  }\n\n  @Listen('pdsTableSelectAll')\n  handleTableSelectAll(event: CustomEvent<{ isSelected: boolean }>) {\n    if (event.defaultPrevented) return;\n\n    const pdsTableBody = this.el.querySelector('pds-table-body');\n    const tableRows = Array.from(pdsTableBody.querySelectorAll('pds-table-row'));\n\n    tableRows.forEach((row) => {\n      row.isSelected = event.detail.isSelected;\n    });\n  }\n\n  @Listen('pdsTableRowSelected')\n  async handleTableSelect(event: CustomEvent<{ rowIndex: number; isSelected: boolean }>) {\n    if (event.defaultPrevented) return;\n\n    const allTableRows = this.el.querySelectorAll('pds-table-row');\n    const allSelectedRows = Array.from(allTableRows).every((row) => row.isSelected);\n    const noneSelectedRows = Array.from(allTableRows).every((row) => !row.isSelected);\n    const pdsTableHead = this.el.querySelector('pds-table-head');\n    if (!pdsTableHead) return;\n\n    const headerCheckbox = pdsTableHead.shadowRoot.querySelector('pds-checkbox');\n    headerCheckbox.checked = allSelectedRows;\n    headerCheckbox.indeterminate = !allSelectedRows && !noneSelectedRows;\n  }\n\n  render() {\n    if (this.responsive) {\n      return (\n        <Host\n          class=\"pds-table is-responsive pds-table-responsive-host\"\n          id={this.componentId}\n          role=\"grid\"\n          selectable={this.selectable}\n          tabindex=\"0\"\n          part=\"table responsive-table\"\n        >\n          <div class=\"scroll-shadow-left\" part=\"scroll-shadow-left\"></div>\n          <div class=\"scroll-shadow-right\" part=\"scroll-shadow-right\"></div>\n          <div class=\"pds-table-responsive-container\" part=\"responsive-container\">\n            <div class=\"pds-table-responsive-wrapper\" part=\"responsive-wrapper\">\n              <div class={this.classNames()} part=\"table-inner\">\n                <slot></slot>\n              </div>\n            </div>\n          </div>\n        </Host>\n      );\n    }\n\n    return (\n      <Host\n        class={this.classNames()}\n        id={this.componentId}\n        role=\"grid\"\n        selectable={this.selectable}\n        tabindex=\"0\"\n        part=\"table\"\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pine-core/p-0975b749.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-Cxvdulqq.system.js","./p-BSkbMuB5.system.js"],(function(t){"use strict";var i,e,s,n,a,o,r;return{setters:[function(t){i=t.r;e=t.c;s=t.h;n=t.H;a=t.g},function(t){o=t.g;r=t.d}],execute:function(){var l=":host{--border-head-cell-default:var(--pine-border-width-thin) solid var(--pine-color-grey-100);--box-shadow-default:3px 3px 6px -2px rgba(0, 0, 0, 0.1);-webkit-border-after:var(--border-head-cell-default);border-block-end:var(--border-head-cell-default);color:var(--pine-color-text);display:table-cell;font-family:var(--pine-font-family-body);font-size:var(--pine-font-size);font-weight:var(--pine-font-weight-regular);line-height:var(--pine-line-height-body);padding:var(--pine-dimension-150);position:relative;text-align:start;vertical-align:inherit}:host(.is-compact){padding-block:var(--pine-dimension-2xs)}:host(.is-fixed){background:var(--pine-color-background-container);left:var(--pine-dimension-none);position:-webkit-sticky;position:sticky;z-index:1}:host(.has-scrolled.is-fixed){-webkit-box-shadow:var(--box-shadow-default);box-shadow:var(--box-shadow-default)}:host(.is-sortable){cursor:pointer}:host(.is-sortable) pds-icon{-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs);-webkit-padding-before:2px;padding-block-start:2px;position:absolute}:host(.is-sortable:hover),:host(.is-active){color:var(--pine-color-text-active)}:host(.pds-table-head-cell--align-start){text-align:start}:host(.pds-table-head-cell--align-center){text-align:center}:host(.pds-table-head-cell--align-end){text-align:end}:host(.pds-table-head-cell--align-justify){text-align:justify}";var h=t("pds_table_head_cell",function(){function t(t){var s=this;i(this,t);this.pdsTableSort=e(this,"pdsTableSort");this.scrollContainer=null;this.setupRetries=0;this.sortingDirection="asc";this.tableScrolling=false;this.isSelected=false;this.handleScroll=function(){if(!s.scrollContainer){return}try{s.tableScrolling=s.scrollContainer.scrollLeft>0}catch(t){console.warn("Scroll handler error:",t)}};this.toggleSort=function(){if(s.sortable){var t=s.hostElement.innerText.trim();s.sortingDirection=s.sortingDirection==="asc"?"desc":"asc";s.tableRef.querySelectorAll("pds-table-head-cell").forEach((function(t){t.classList.remove("is-active")}));s.hostElement.classList.toggle("is-active");s.pdsTableSort.emit({column:t,direction:s.sortingDirection})}}}t.prototype.componentWillRender=function(){this.tableRef=this.hostElement.closest("pds-table")};t.prototype.componentDidLoad=function(){if(this.tableRef&&this.tableRef.responsive&&this.tableRef.fixedColumn){this.setupScrollListener()}};t.prototype.disconnectedCallback=function(){this.cleanupScrollListener()};t.prototype.setupScrollListener=function(){var t=this;var i;if(!this.tableRef)return;var e=(i=this.tableRef.shadowRoot)===null||i===void 0?void 0:i.querySelector(".pds-table-responsive-container");if(e){this.scrollContainer=e;this.scrollContainer.addEventListener("scroll",this.handleScroll,{passive:true});this.handleScroll();this.setupRetries=0}else{this.setupTimer=window.setTimeout((function(){if(t.scrollContainer)return;t.setupRetries=(t.setupRetries||0)+1;if(t.setupRetries<=50){t.setupScrollListener()}else{console.warn("Failed to find responsive container after 50 attempts")}}),100)}};t.prototype.cleanupScrollListener=function(){if(this.scrollContainer){this.scrollContainer.removeEventListener("scroll",this.handleScroll);this.scrollContainer=null}if(this.setupTimer!==undefined){window.clearTimeout(this.setupTimer);this.setupTimer=undefined}this.setupRetries=0};t.prototype.classNames=function(){var t=[];if(this.tableRef&&this.tableRef.compact){t.push("is-compact")}if(this.cellAlign){t.push("pds-table-head-cell--align-".concat(this.cellAlign))}if(this.sortable){t.push("is-sortable")}if(this.sortable&&this.sortingDirection!==null){t.push("sort-"+this.sortingDirection)}if(this.tableRef&&this.tableRef.fixedColumn&&this.tableScrolling){t.push("has-scrolled")}return t.join(" ")};t.prototype.render=function(){return s(n,{key:"3d950a2997ef4c095d08f9c4e67b9a963fea093d",class:this.classNames(),role:"columnheader",onClick:this.toggleSort,part:"head-cell",style:this.tableRef&&this.tableRef.fixedColumn&&this.tableRef.selectable?{"--fixed-cell-position":"40px"}:{}},s("slot",{key:"8ca7d4d169612e5ba237691d9a5ec9ed35610230"}),this.sortable&&s("pds-icon",{key:"e2e214b39a1706d887bb34a0d4fc3f632e752306",icon:this.sortingDirection==="asc"?o:r,part:"sort-icon"}))};Object.defineProperty(t.prototype,"hostElement",{get:function(){return a(this)},enumerable:false,configurable:true});return t}());h.style=l}}}));
-//# sourceMappingURL=p-0975b749.system.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTableHeadCellCss","PdsTableHeadCell","exports","class_1","hostRef","_this","this","scrollContainer","setupRetries","sortingDirection","tableScrolling","isSelected","handleScroll","scrollLeft","error","console","warn","toggleSort","sortable","column","hostElement","innerText","trim","tableRef","querySelectorAll","forEach","headCell","classList","remove","toggle","pdsTableSort","emit","direction","prototype","componentWillRender","closest","componentDidLoad","responsive","fixedColumn","setupScrollListener","disconnectedCallback","cleanupScrollListener","container","_a","shadowRoot","querySelector","addEventListener","passive","setupTimer","window","setTimeout","removeEventListener","undefined","clearTimeout","classNames","compact","push","cellAlign","concat","join","render","h","Host","key","class","role","onClick","part","style","selectable","icon","upSmall","downSmall"],"sources":["src/components/pds-table/pds-table-head-cell/pds-table-head-cell.scss?tag=pds-table-head-cell&encapsulation=shadow","src/components/pds-table/pds-table-head-cell/pds-table-head-cell.tsx"],"sourcesContent":[":host {\n  --border-head-cell-default: var(--pine-border-width-thin) solid var(--pine-color-grey-100);\n\n  --box-shadow-default: 3px 3px 6px -2px rgba(0, 0, 0, 0.1);\n\n  border-block-end: var(--border-head-cell-default);\n  color: var(--pine-color-text);\n  display: table-cell;\n  font-family: var(--pine-font-family-body);\n  font-size: var(--pine-font-size);\n  font-weight: var(--pine-font-weight-regular);\n  line-height: var(--pine-line-height-body);\n  padding: var(--pine-dimension-150);\n  position: relative;\n  text-align: start;\n  vertical-align: inherit;\n}\n\n:host(.is-compact) {\n  padding-block: var(--pine-dimension-2xs)\n}\n\n:host(.is-fixed) {\n  background: var(--pine-color-background-container);\n  left: var(--pine-dimension-none);\n  position: sticky;\n  z-index: 1;\n}\n\n// box shadow when table has scrolled and cell is fixed\n:host(.has-scrolled.is-fixed) {\n  box-shadow: var(--box-shadow-default);\n}\n\n:host(.is-sortable) {\n  cursor: pointer;\n\n  pds-icon {\n    margin-inline-start: var(--pine-dimension-2xs);\n    padding-block-start: 2px;\n    position: absolute;\n  }\n}\n\n:host(.is-sortable:hover),\n:host(.is-active) {\n  color: var(--pine-color-text-active);\n}\n\n// Text Alignment\n:host(.pds-table-head-cell--align-start) {\n  text-align: start;\n}\n\n:host(.pds-table-head-cell--align-center) {\n  text-align: center;\n}\n\n:host(.pds-table-head-cell--align-end) {\n  text-align: end;\n}\n\n:host(.pds-table-head-cell--align-justify) {\n  text-align: justify;\n}\n","import { Component, Element, Host, Prop, h, Event, EventEmitter, State } from '@stencil/core';\n\nimport { downSmall, upSmall } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-table-head-cell',\n  styleUrls: ['pds-table-head-cell.scss'],\n  shadow: true,\n})\nexport class PdsTableHeadCell {\n  @Element() hostElement: HTMLPdsTableHeadCellElement;\n  private tableRef: HTMLPdsTableElement;\n  private scrollContainer: HTMLElement | null = null;\n  private setupTimer: number | undefined;\n  private setupRetries: number = 0;\n\n  /**\n   * Sets the text alignment within the head cell.\n   */\n  @Prop() cellAlign?: 'start' | 'center' | 'end' | 'justify';\n\n  /**\n   * Determines whether the table column is sortable when set to `true`.\n   */\n  @Prop() sortable: boolean;\n\n  /**\n   * Event emitted to signal that a table column header has been sorted, providing information about the sorted column's name and sorting direction.\n   */\n  @Event() pdsTableSort: EventEmitter<{ column: string; direction: string }>;\n\n  /**\n   * The direction of sorting.\n   */\n  @State() private sortingDirection: 'asc' | 'desc' = 'asc';\n\n  /**\n   * Determines if the table is currently scrolling.\n   * @defaultValue false\n   */\n  @State() private tableScrolling: boolean = false;\n\n  /**\n   * Determines if the table row is currently selected.\n   * @defaultValue false\n   */\n  @State() isSelected: boolean = false;\n\n  componentWillRender() {\n    this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n  }\n\n  componentDidLoad() {\n    if (this.tableRef && this.tableRef.responsive && this.tableRef.fixedColumn) {\n      // For responsive tables with fixed columns, set up scroll detection\n      // This enables the first column header to show a shadow when the table is scrolled horizontally\n      this.setupScrollListener();\n    }\n  }\n\n  disconnectedCallback() {\n    this.cleanupScrollListener();\n  }\n\n  private setupScrollListener() {\n    if (!this.tableRef) return;\n\n    // Query shadowRoot once and cache the container\n    const container = this.tableRef.shadowRoot?.querySelector('.pds-table-responsive-container') as HTMLElement;\n\n    if (container) {\n      // Container available immediately\n      this.scrollContainer = container;\n      this.scrollContainer.addEventListener('scroll', this.handleScroll, { passive: true });\n      this.handleScroll(); // Initial check\n      this.setupRetries = 0; // Reset counter on success\n    } else {\n      // Container not ready, set up timer for retry with bounds\n      this.setupTimer = window.setTimeout(() => {\n        if (this.scrollContainer) return; // Already found\n        this.setupRetries = (this.setupRetries || 0) + 1;\n        if (this.setupRetries <= 50) {\n          this.setupScrollListener();\n        } else {\n          console.warn('Failed to find responsive container after 50 attempts');\n        }\n      }, 100);\n    }\n  }\n\n  private cleanupScrollListener() {\n    if (this.scrollContainer) {\n      this.scrollContainer.removeEventListener('scroll', this.handleScroll);\n      this.scrollContainer = null;\n    }\n\n    if (this.setupTimer !== undefined) {\n      window.clearTimeout(this.setupTimer);\n      this.setupTimer = undefined;\n    }\n\n    this.setupRetries = 0; // Reset retry counter\n  }\n\n  /**\n   * Handles scroll events to update fixed column shadow state.\n   * Updates the tableScrolling state to control CSS classes for fixed column shadows.\n   * @private\n   */\n  private handleScroll = () => {\n    if (!this.scrollContainer) {\n      return;\n    }\n\n    try {\n      this.tableScrolling = this.scrollContainer.scrollLeft > 0;\n    } catch (error) {\n      console.warn('Scroll handler error:', error);\n    }\n  };\n\n  private toggleSort = () => {\n    if (this.sortable) {\n      const column = this.hostElement.innerText.trim();\n      this.sortingDirection = this.sortingDirection === 'asc' ? 'desc' : 'asc';\n\n      this.tableRef.querySelectorAll('pds-table-head-cell').forEach((headCell) => {\n        headCell.classList.remove('is-active');\n      });\n\n      this.hostElement.classList.toggle('is-active');\n      this.pdsTableSort.emit({ column, direction: this.sortingDirection });\n    }\n  }\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.tableRef && this.tableRef.compact) {\n      classNames.push('is-compact');\n    }\n\n    if (this.cellAlign) {\n      classNames.push(`pds-table-head-cell--align-${this.cellAlign}`);\n    }\n\n    if (this.sortable) {\n      classNames.push('is-sortable');\n    }\n\n    if (this.sortable && this.sortingDirection !== null) {\n      classNames.push('sort-' + this.sortingDirection);\n    }\n\n    if (this.tableRef && this.tableRef.fixedColumn && this.tableScrolling) {\n      classNames.push('has-scrolled');\n    }\n\n    return classNames.join(' ');\n  }\n\n  render() {\n    return (\n      <Host\n        class={this.classNames()}\n        role=\"columnheader\"\n        onClick={this.toggleSort}\n        part=\"head-cell\"\n        style={\n          this.tableRef &&\n          this.tableRef.fixedColumn &&\n          this.tableRef.selectable\n            ? { '--fixed-cell-position': '40px' }\n            : {}\n        }\n      >\n        <slot></slot>\n        {this.sortable && (\n          <pds-icon icon={this.sortingDirection === 'asc' ? upSmall : downSmall} part=\"sort-icon\" />\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pine-core/p-0befa8f0.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as i,H as o,g as r}from"./p-Bf1dou5H.js";import{c as s,a as e,o as l,f as a,s as n}from"./p-DbQzNDdQ.js";const p='.pds-tooltip{--tooltip-border-width-arrow-down:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-left:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-right:var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-border-width-arrow-up:0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-sizing-arrow:6px;--tooltip-sizing-arrow-offset:14px;--tooltip-dimension-max-width:320px}.pds-tooltip__content{background-color:var(--pine-color-primary);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);max-width:var(--tooltip-dimension-max-width);opacity:0;padding:var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content}.pds-tooltip--is-open .pds-tooltip__content{opacity:1;visibility:visible;z-index:1}.pds-tooltip.pds-tooltip--has-html-content .pds-tooltip__content{width:auto}.pds-tooltip__content::after{border-color:transparent;border-right-color:transparent;border-style:solid;border-width:var(--tooltip-border-width-arrow-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);bottom:var(--tooltip-sizing-arrow-offset);left:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:50%;top:initial;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--top-start .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:initial;right:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);bottom:var(--tooltip-sizing-arrow-offset);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:50%;top:calc(var(--tooltip-sizing-arrow) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:initial;right:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}';const h=class{constructor(i){t(this,i);this._isInteractiveOpen=false;this.portalEl=null;this.resolvedPlacement="right";this.triggerEl=null;this.contentDiv=null;this.slotMutationObserver=null;this.currentPathname="";this.pathnameCheckInterval=null;this.stopAutoUpdate=null;this.hasArrow=true;this.htmlContent=false;this.placement="right";this.maxWidth="352px";this.opened=false;this.handleHide=()=>{if(this.opened&&!this._isInteractiveOpen){return}this.hideTooltip();this._isInteractiveOpen=false};this.handleShow=()=>{if(this.opened&&!this._isInteractiveOpen){return}this._isInteractiveOpen=true;this.showTooltip()};this.handlePageShow=()=>{if(this.opened&&!this._isInteractiveOpen){return}this.opened=false;this._isInteractiveOpen=false};this.handleSpaNavigation=()=>{if(this.opened&&!this._isInteractiveOpen){return}this.hideTooltip();this._isInteractiveOpen=false};this.checkPathnameChange=()=>{if(window.location.pathname!==this.currentPathname){this.currentPathname=window.location.pathname;this.handleSpaNavigation()}}}handleOpenToggle(t,i){if(t===false&&i===true){this._isInteractiveOpen=false}}componentWillLoad(){this._isInteractiveOpen=false;this.resolvedPlacement=this.placement}componentDidLoad(){window.addEventListener("pageshow",this.handlePageShow);this.currentPathname=window.location.pathname;this.triggerEl=this.el.querySelector(".pds-tooltip__trigger");const t=this.el.querySelector(".pds-tooltip__content-slot-wrapper");if(t!==null){this.slotMutationObserver=new MutationObserver((()=>{if(this.opened&&this.portalEl!==null){this.removePortal();this.createPortal()}}));this.slotMutationObserver.observe(t,{childList:true,subtree:false})}}disconnectedCallback(){window.removeEventListener("pageshow",this.handlePageShow);if(this.slotMutationObserver!==null){this.slotMutationObserver.disconnect();this.slotMutationObserver=null}if(this.portalEl!==null){this.removePortal()}if(this.pathnameCheckInterval!==null){clearInterval(this.pathnameCheckInterval);this.pathnameCheckInterval=null}if(this.stopAutoUpdate!==null){this.stopAutoUpdate();this.stopAutoUpdate=null}}componentDidRender(){if(this.opened&&this.portalEl===null){this.createPortal()}else if(!this.opened&&this.portalEl!==null){this.removePortal()}if(this.portalEl!==null){this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`;this.portalEl.setAttribute("aria-hidden",this.opened?"false":"true");this.portalEl.setAttribute("aria-live",this.opened?"polite":"off")}}async showTooltip(){this.opened=true}async hideTooltip(){this.opened=false}determinePositioningAnchor(){let t=this.triggerEl;if(this.triggerEl!==null){const i=this.triggerEl.childNodes;for(let o=0;o<i.length;o++){const r=i[o];if(r.nodeType===Node.ELEMENT_NODE){t=r;break}}}return t}async repositionPortal(){const t=this.determinePositioningAnchor();if(t!==null&&this.portalEl!==null){try{const{x:i,y:o,placement:r}=await s(t,this.portalEl,{placement:this.placement,strategy:"fixed",middleware:[l(8),a(),n({padding:5})]});this.resolvedPlacement=r;Object.assign(this.portalEl.style,{left:`${i}px`,top:`${o}px`,position:"fixed"});this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`}catch(i){console.warn("Failed to position tooltip:",i);this.resolvedPlacement=this.placement;const o=t.getBoundingClientRect();this.portalEl.style.left=`${o.right+8}px`;this.portalEl.style.top=`${o.top}px`;this.portalEl.style.position="fixed"}}}createPortal(){if(this.portalEl!==null)return;this.portalEl=document.createElement("div");this.portalEl.className=`pds-tooltip pds-tooltip--${this.resolvedPlacement} ${this.htmlContent?"pds-tooltip--has-html-content":""} ${this.opened?"pds-tooltip--is-open":""} ${this.hasArrow?"":"pds-tooltip--no-arrow"}`;this.portalEl.style.position="fixed";this.portalEl.style.zIndex="9999";if(this.portalEl.id===""){const t=h.instanceCounter++;const i=this.componentId||this.el.id||"pds-tooltip";this.portalEl.id=`${i}-portal-${t}`}if(this.portalEl.getAttribute("id")!==this.portalEl.id){this.portalEl.setAttribute("id",this.portalEl.id)}this.portalEl.setAttribute("role","tooltip");this.portalEl.setAttribute("aria-hidden",this.opened?"false":"true");this.portalEl.setAttribute("aria-live",this.opened?"polite":"off");this.portalEl.style.maxWidth=this.maxWidth;this.contentDiv=document.createElement("div");this.contentDiv.className="pds-tooltip__content";this.contentDiv.setAttribute("aria-hidden",this.opened?"false":"true");this.contentDiv.setAttribute("aria-live",this.opened?"polite":"off");const t=this.el.querySelector(".pds-tooltip__content-slot-wrapper");const i=t===null||t===void 0?void 0:t.querySelector('[slot="content"]');let o=false;if(i!==null){const t=Array.from(i.childNodes);if(t.length>0){const i=t.some((t=>{var i;return t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&((i=t.textContent)===null||i===void 0?void 0:i.trim())!==""}));if(i){o=true;t.forEach((t=>{var i;if(t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&((i=t.textContent)===null||i===void 0?void 0:i.trim())!==""){this.contentDiv.appendChild(t.cloneNode(true))}}))}}}if(!o&&typeof this.content==="string"&&this.content.trim()!==""){this.contentDiv.textContent=this.content}this.portalEl.appendChild(this.contentDiv);document.body.appendChild(this.portalEl);this.repositionPortal().catch((t=>{console.warn("Failed to position tooltip on creation:",t)}));if(this.triggerEl&&this.portalEl){this.stopAutoUpdate=e(this.triggerEl,this.portalEl,(()=>{this.repositionPortal().catch((t=>{console.warn("Failed to reposition tooltip on auto update:",t)}))}))}window.addEventListener("popstate",this.handleSpaNavigation,true);window.addEventListener("hashchange",this.handleSpaNavigation,true);this.pathnameCheckInterval=setInterval(this.checkPathnameChange,100);if(this.triggerEl!==null&&this.portalEl.id!==""){this.triggerEl.setAttribute("aria-describedby",this.portalEl.id)}}removePortal(){if(this.stopAutoUpdate!==null){this.stopAutoUpdate();this.stopAutoUpdate=null}if(this.pathnameCheckInterval!==null){clearInterval(this.pathnameCheckInterval);this.pathnameCheckInterval=null}if(this.portalEl!==null){window.removeEventListener("popstate",this.handleSpaNavigation,true);window.removeEventListener("hashchange",this.handleSpaNavigation,true);try{if(this.portalEl.parentNode){this.portalEl.parentNode.removeChild(this.portalEl)}}catch(t){console.warn("Portal element could not be removed from DOM:",t)}this.portalEl=null}if(this.triggerEl!==null){this.triggerEl.removeAttribute("aria-describedby")}this.contentDiv=null}render(){const t=this.componentId||undefined;return i(o,{key:"a07130a894d2e76cbbeab98b62f7d44883b2ffbf",id:t,class:{"pds-tooltip--is-open":this.opened}},i("span",{key:"3b78462857e4b196caca8d1fa12fc2a4ac286af5",class:"pds-tooltip__trigger",onMouseEnter:this.handleShow,onMouseLeave:this.handleHide,onFocusin:this.handleShow,onFocusout:this.handleHide,ref:t=>this.triggerEl=t},i("slot",{key:"a480486c0a4e39d1afe236e344b4711b4914a89f"})),i("div",{key:"1ccfb6f48fbaccc6ba99b4d3e263c6f68c00d3f0",class:"pds-tooltip__content-slot-wrapper",hidden:true},i("slot",{key:"67a4d2346c8d1574e17e9ccd035d83e1b232580d",name:"content"})))}get el(){return r(this)}static get watchers(){return{opened:["handleOpenToggle"]}}};h.instanceCounter=0;h.style=p;export{h as pds_tooltip};
-//# sourceMappingURL=p-0befa8f0.entry.js.map

package/dist/pine-core/p-0befa8f0.entry.js.map

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

package/dist/pine-core/p-0d18171c.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-Cxvdulqq.system.js"],(function(e){"use strict";var a,t,i,n,s;return{setters:[function(e){a=e.r;t=e.c;i=e.h;n=e.H;s=e.g}],execute:function(){var o='pds-tab{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;position:relative}.pds-tabs--pill pds-tab{-ms-flex:1;flex:1}.pds-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:var(--pine-border-width-none);-webkit-box-shadow:none;box-shadow:none;color:inherit;cursor:pointer;font-family:inherit;padding:var(--pine-dimension-none);-ms-flex-align:center;align-items:center;color:var(--pine-color-text-secondary);display:-ms-inline-flexbox;display:inline-flex;position:relative;text-decoration:none;white-space:nowrap}.pds-tab.is-active,.pds-tab[aria-selected=true]{color:var(--pine-color-text)}.pds-tab.is-active .pds-tab__content::after,.pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tab:hover{color:var(--pine-color-text)}.pds-tab:focus{outline:none}.pds-tab:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-tab .pds-tab__content{font-family:var(--pine-font-family-body);font-size:var(--pine-font-size);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing);line-height:var(--pine-line-height-body);-webkit-padding-after:11px;padding-block-end:11px;position:relative}.pds-tab .pds-tab__content::after{background-color:var(--pine-color-brand);content:"";height:3px;inset-block-end:var(--pine-dimension-none);inset-inline-end:var(--pine-dimension-none);inset-inline-start:var(--pine-dimension-none);opacity:0;position:absolute}.pds-tab .pds-tab-edge{display:none}.pds-tabs--availability{--color-background-tab:transparent}.pds-tabs--availability .pds-tab{background-color:var(--color-background-tab);border-radius:calc(var(--pine-dimension-xs) * 1.25) calc(var(--pine-dimension-xs) * 1.25) var(--pine-dimension-none) var(--pine-dimension-none);padding:8px 16px 13px}.pds-tabs--availability .pds-tab.is-active,.pds-tabs--availability .pds-tab[aria-selected=true]{--color-background-tab:var(--pine-color-secondary)}.pds-tabs--availability .pds-tab.is-active .pds-tab__content::after,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tabs--availability .pds-tab.is-active .pds-tab-edge,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab-edge{z-index:1}.pds-tabs--availability .pds-tab:hover:not(.is-active,[aria-selected=true]){--color-background-tab:var(--pine-color-secondary-hover)}.pds-tabs--availability .pds-tab:focus-visible{color:var(--pine-color-text-secondary)}.pds-tabs--availability .pds-tab__content{-webkit-padding-after:7px;padding-block-end:7px}.pds-tabs--availability .pds-tab-edge{bottom:0;display:block;height:8px;inset-inline-end:100%;overflow:hidden;position:absolute;width:8px}.pds-tabs--availability .pds-tab-edge::before{border-radius:50%;bottom:0;-webkit-box-shadow:4px 4px 0 0 var(--color-background-tab);box-shadow:4px 4px 0 0 var(--color-background-tab);content:"";display:block;height:200%;inset-inline-end:0;position:absolute;width:200%}.pds-tabs--availability .pds-tab-edge--end{inset-inline-end:unset;inset-inline-start:100%}.pds-tabs--availability .pds-tab-edge--end::before{-webkit-box-shadow:-4px 4px 0 0 var(--color-background-tab);box-shadow:-4px 4px 0 0 var(--color-background-tab);inset-inline-end:unset;inset-inline-start:0}.pds-tabs--filter .pds-tab{background-color:var(--pine-color-background-container-disabled);border-radius:50px;color:var(--pine-color-text);padding:6px 15px}.pds-tabs--filter .pds-tab.is-active,.pds-tabs--filter .pds-tab[aria-selected=true]{background-color:var(--pine-color-primary);color:var(--pine-color-text-primary)}.pds-tabs--filter .pds-tab.is-active:hover,.pds-tabs--filter .pds-tab[aria-selected=true]:hover{background-color:var(--pine-color-primary-hover)}.pds-tabs--filter .pds-tab:hover:not(.is-active,[aria-selected=true]){background-color:var(--pine-color-border-disabled)}.pds-tabs--filter .pds-tab__content{-webkit-padding-after:var(--pine-dimension-none);padding-block-end:var(--pine-dimension-none)}.pds-tabs--filter .pds-tab__content::after{content:unset}.pds-tabs--pill{--color-background-tab:transparent}.pds-tabs--pill .pds-tab{background-color:var(--color-background-tab);border:var(--pine-border-width-thin) solid transparent;border-radius:var(--pine-dimension-xs);color:var(--pine-color-text-readonly);-ms-flex:1;flex:1;height:34px;-ms-flex-pack:center;justify-content:center}.pds-tabs--pill .pds-tab .pds-tab__content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-webkit-padding-after:0;padding-block-end:0}.pds-tabs--pill .pds-tab.is-active,.pds-tabs--pill .pds-tab[aria-selected=true]{--color-background-tab:var(--pine-color-white);border-color:var(--pine-color-border);-webkit-box-shadow:var(--pine-box-shadow-100);box-shadow:var(--pine-box-shadow-100);color:var(--pine-color-text-active);z-index:1;}.pds-tabs--pill .pds-tab.is-active:focus-visible,.pds-tabs--pill .pds-tab[aria-selected=true]:focus-visible{border-color:var(--color-border-focus);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-tabs--pill .pds-tab.is-active .pds-tab__content::after,.pds-tabs--pill .pds-tab[aria-selected=true] .pds-tab__content::after{opacity:0}';var r=e("pds_tab",function(){function e(e){a(this,e);this.pdsTabClick=t(this,"pdsTabClick");this.selected=false}e.prototype.onTabClick=function(e,a){this.pdsTabClick.emit([e,a])};e.prototype.render=function(){var e=i("span",{key:"837cf57372db654f6ca411054446ebf0bc27b539",class:"pds-tab-edge",role:"presentation"});var a=i("span",{key:"e15055442d56b50e6ac21bfb76fc0f599406a4fb",class:"pds-tab-edge pds-tab-edge--end",role:"presentation"});return i(n,{key:"1c02a1c8e5e562449ab954061a10acc3d54c3efc",variant:this.variant,slot:"tabs",index:this.index},i("button",{key:"31b0e173dd738fa272dcaf4fc48a0581978f43b2",role:"tab",id:this.parentComponentId+"__"+this.name,"aria-controls":this.parentComponentId+"__"+this.name+"-panel",tabindex:this.selected?"0":"-1","aria-selected":this.selected?"true":"false",class:this.selected?"pds-tab is-active":"pds-tab",onClick:this.onTabClick.bind(this,this.index,this.parentComponentId)},this.variant==="availability"&&e,this.variant==="availability"&&a,i("div",{key:"95b4f8d4c226e3b3a174d439816ec4d28cef0686",class:"pds-tab__content"},i("slot",{key:"452a208775d54a290c0fcc6a69f6e546fde29afe"}))))};Object.defineProperty(e.prototype,"el",{get:function(){return s(this)},enumerable:false,configurable:true});return e}());r.style=o}}}));
-//# sourceMappingURL=p-0d18171c.system.entry.js.map

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

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

package/dist/pine-core/p-1773aeac.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-Cxvdulqq.system.js","./p-BG7_qxVr.system.js","./p-BSkbMuB5.system.js"],(function(e){"use strict";var i,r,s,t,n,a,o,l;return{setters:[function(e){i=e.r;r=e.c;s=e.h;t=e.H;n=e.g},function(e){a=e.m},function(e){o=e.i;l=e.e}],execute:function(){var d=":host{--pine-select-color-background-danger:var(--pine-color-red-050)}";var c=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";var p=':host{--pds-select-background:var(--pine-color-background-container);--pds-select-border:var(--pine-border);--pds-select-border-radius:var(--pine-dimension-125);--pds-select-border-radius-start-end:var(--pine-dimension-125);--pds-select-border-radius-start-start:var(--pine-dimension-125);--pds-select-border-radius-end-end:var(--pine-dimension-125);--pds-select-border-radius-end-start:var(--pine-dimension-125);--pds-select-min-height:36px;--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger)}:host .hidden,:host :host([hidden]){display:none}.pds-select{display:grid;-ms-flex-direction:column;flex-direction:column;grid-template-areas:"label label" "field field" "message message";grid-template-columns:1fr minmax(2rem, -webkit-min-content);grid-template-columns:1fr minmax(2rem, min-content);grid-template-rows:-webkit-min-content -webkit-min-content -webkit-min-content;grid-template-rows:min-content min-content min-content;position:relative;width:100%}.pds-select__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-area:label;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--pds-select-background);border:var(--pds-select-border);border-radius:var(--pds-select-border-radius);border-bottom-left-radius:var(--pds-select-border-radius-end-start, var(--pds-select-border-radius));border-bottom-right-radius:var(--pds-select-border-radius-end-end, var(--pds-select-border-radius));border-top-left-radius:var(--pds-select-border-radius-start-start, var(--pds-select-border-radius));border-top-right-radius:var(--pds-select-border-radius-start-end, var(--pds-select-border-radius));font:var(--pine-typography-body);grid-area:field;letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-select-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150);-webkit-padding-end:var(--pine-dimension-450);padding-inline-end:var(--pine-dimension-450);position:relative}select:hover{border-color:var(--pine-color-border-hover);cursor:pointer}select:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}select:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}select:has(~.pds-select__message .pds-select__error-message):focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) select{background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host(.is-invalid) select:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-select__error-message,.pds-select__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-select__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-select__message{grid-area:message}.pds-select__select-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-column:-1/-2;grid-row:2/3;height:var(--pds-select-min-height);pointer-events:none;position:relative;z-index:1}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}';var f=e("pds_select",function(){function e(e){var s=this;i(this,e);this.pdsSelectChange=r(this,"pdsSelectChange");this.disabled=false;this.multiple=false;this.required=false;this.onSelectUpdate=function(e){var i=e.target;var r=Array.from(i.options).filter((function(e){return e.selected})).map((function(e){return e.value}));if(r.length===1&&!s.multiple){s.value=r[0]}else{s.value=r}s.pdsSelectChange.emit(e)};this.handleSlotChange=function(){var e=s.slotContainer.querySelector("slot");s.selectEl.innerHTML="";var i=e.assignedElements({flatten:true});i.forEach((function(e){if(["OPTION","OPTGROUP"].includes(e.tagName)){var i=e.cloneNode(true);if(i.tagName==="OPTION"&&i.value===s.value){i.selected=true}s.selectEl.appendChild(i)}}));s.updateSelectedOption()}}e.prototype.valueChanged=function(){this.updateSelectedOption();this.updateFormValue()};e.prototype.connectedCallback=function(){if(this.el.attachInternals){this.internals=this.el.attachInternals()}};e.prototype.componentWillLoad=function(){this.updateSelectedOption()};e.prototype.componentDidLoad=function(){this.updateFormValue()};e.prototype.updateSelectedOption=function(){var e=this;if(this.selectEl){var i=this.selectEl.options;Array.from(i).map((function(i){if(Array.isArray(e.value)){i.selected=e.value.includes(i.value)}else{i.selected=e.value===i.value}}))}};e.prototype.getHelperMessage=function(){return this.helperMessage&&s("p",{class:"pds-select__helper-message",id:a(this.componentId,"helper")},this.helperMessage)};e.prototype.getErrorMessage=function(){return this.errorMessage&&s("p",{class:"pds-select__error-message",id:a(this.componentId,"error"),"aria-live":"assertive"},s("pds-icon",{icon:o,size:"small"}),this.errorMessage)};e.prototype.renderMessages=function(){if(!this.helperMessage&&!this.errorMessage)return null;return s("div",{class:"pds-select__message"},this.getHelperMessage(),this.getErrorMessage())};e.prototype.classNames=function(){var e=[];if(this.invalid){e.push("is-invalid")}if(this.disabled){e.push("is-disabled")}return e.join("  ")};e.prototype.renderAction=function(){var e=this.el.querySelector('[slot="action"]')!==null;if(e){return s("div",{class:"pds-select__action",part:"action"},s("slot",{name:"action"}))}return null};e.prototype.updateFormValue=function(){var e=this;if(this.internals&&this.internals.setFormValue){var i=this.value;if(Array.isArray(i)){if(i.length>1){var r=new FormData;i.forEach((function(i){return r.append(e.name||"",i)}));this.internals.setFormValue(r)}else{this.internals.setFormValue(i[0]||null)}}else{this.internals.setFormValue(i||null)}if(this.selectEl&&this.internals&&this.internals.setValidity){this.internals.setValidity(this.selectEl.validity,this.selectEl.validationMessage,this.selectEl)}}};e.prototype.formResetCallback=function(){this.value="";this.updateFormValue()};e.prototype.formDisabledCallback=function(e){this.disabled=e};e.prototype.formStateRestoreCallback=function(e){if(typeof e==="string"){this.value=e}else if(e instanceof FormData&&this.name){var i=e.getAll(this.name);if(i.length>1){this.value=i.filter((function(e){return typeof e==="string"}))}else if(i.length===1&&typeof i[0]==="string"){this.value=i[0]}}};e.prototype.render=function(){var e=this;var i=this.el.querySelector('[slot="action"]')!==null;return s(t,{key:"7d2f9b013ba40e8feb4282099eaf2db32b94497b","aria-disabled":this.disabled?"true":null,class:this.classNames(),"has-action":i&&!this.hideLabel?"true":null},s("div",{key:"fad19d788ff8f3b3b6ec9ef198c753ef4b4dc4c4",class:"pds-select"},!this.hideLabel&&s("div",{key:"870c405e80fbeb3890116a53cd986056af7e4795",class:"pds-select__label-wrapper"},s("label",{key:"6c7232f371f0bd95a94584fe8403eefc25862f5b",htmlFor:this.componentId},s("span",{key:"7a6816bd7d51b05cd935f3e13e27f540cf09e1e1",class:this.hideLabel?"visually-hidden":""},this.label)),i&&this.renderAction()),s("select",{key:"a2bbae963ed55ed73eb614725258745ad20d9acb","aria-label":this.hideLabel?this.label:undefined,autocomplete:this.autocomplete||undefined,class:"pds-select__field",disabled:this.disabled,id:this.componentId,multiple:this.multiple,name:this.name,onChange:this.onSelectUpdate,part:"select",required:this.required,ref:function(i){return e.selectEl=i}}),s("div",{key:"cd9ef83c08806ab2efc1c4b6851bc634168ede69","aria-hidden":"true",class:"hidden",ref:function(i){return e.slotContainer=i}},s("slot",{key:"ae605bfc434bedf4b37e0e96a9124ea7b59d1ede",onSlotchange:this.handleSlotChange})),this.renderMessages(),!this.multiple&&s("pds-icon",{key:"360b635e7b4aed8522f0176be553c9e3804dbb3a",class:"pds-select__select-icon",icon:l})))};Object.defineProperty(e,"formAssociated",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{value:["valueChanged"]}},enumerable:false,configurable:true});return e}());f.style=d+(c+p)}}}));
-//# sourceMappingURL=p-1773aeac.system.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["pdsSelectTokensCss","labelCss","pdsSelectCss","PdsSelect","exports","class_1","hostRef","_this","this","disabled","multiple","required","onSelectUpdate","e","target","values","Array","from","options","filter","option","map","length","value","pdsSelectChange","emit","handleSlotChange","slot","slotContainer","querySelector","selectEl","innerHTML","assignedElements","flatten","forEach","item","includes","tagName","clonedItem","cloneNode","selected","appendChild","updateSelectedOption","prototype","valueChanged","updateFormValue","connectedCallback","el","attachInternals","internals","componentWillLoad","componentDidLoad","isArray","getHelperMessage","helperMessage","h","class","id","messageId","componentId","getErrorMessage","errorMessage","icon","danger","size","renderMessages","classNames","invalid","push","join","renderAction","hasAction","part","name","setFormValue","formData_1","FormData","val","append","setValidity","validity","validationMessage","formResetCallback","formDisabledCallback","formStateRestoreCallback","state","getAll","v","render","Host","key","hideLabel","htmlFor","label","undefined","autocomplete","onChange","ref","onSlotchange","enlarge"],"sources":["src/components/pds-select/pds-select.tokens.scss?tag=pds-select&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-select&encapsulation=shadow","src/components/pds-select/pds-select.scss?tag=pds-select&encapsulation=shadow","src/components/pds-select/pds-select.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-select/pds-select.tokens'\n",":host {\n  display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n  color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n  label {\n    color: var(--pine-color-text-label-readonly);\n  }\n}\n\nlabel {\n  color: var(--pine-color-text-label);\n  font: var(--pine-typography-body-medium);\n  letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n  --pds-select-background: var(--pine-color-background-container);\n  --pds-select-border: var(--pine-border);\n  --pds-select-border-radius: var(--pine-dimension-125);\n  --pds-select-border-radius-start-end: var(--pine-dimension-125);\n  --pds-select-border-radius-start-start: var(--pine-dimension-125);\n  --pds-select-border-radius-end-end: var(--pine-dimension-125);\n  --pds-select-border-radius-end-start: var(--pine-dimension-125);\n  --pds-select-min-height: 36px;\n  --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n  --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n  .hidden,\n  :host([hidden]) {\n    display: none;\n  }\n}\n\n.pds-select {\n  display: grid;\n  flex-direction: column;\n  grid-template-areas:\n    'label label'\n    'field field'\n    'message message';\n  grid-template-columns: 1fr minmax(2rem, min-content);\n  grid-template-rows: min-content min-content min-content;\n  position: relative;\n  width: 100%;\n}\n\n.pds-select__label-wrapper {\n  align-items: center;\n  display: flex;\n  grid-area: label;\n  justify-content: space-between;\n  margin-block-end: var(--pine-dimension-2xs);\n}\n\n.pds-select__action {\n  align-items: center;\n  display: flex;\n  gap: var(--pine-dimension-xs);\n  margin-inline-start: var(--pine-dimension-xs);\n}\n\nlabel {\n  margin-block-end: var(--pine-dimension-2xs);\n}\n\n// When label is inside wrapper, remove its margin\n.pds-select__label-wrapper label {\n  margin-block-end: 0;\n}\n\nselect {\n  appearance: none;\n  background-color: var(--pds-select-background);\n  border: var(--pds-select-border);\n  border-radius: var(--pds-select-border-radius);\n  border-bottom-left-radius: var(--pds-select-border-radius-end-start, var(--pds-select-border-radius));\n  border-bottom-right-radius: var(--pds-select-border-radius-end-end, var(--pds-select-border-radius));\n  border-top-left-radius: var(--pds-select-border-radius-start-start, var(--pds-select-border-radius));\n  border-top-right-radius: var(--pds-select-border-radius-start-end, var(--pds-select-border-radius));\n  font: var(--pine-typography-body);\n  grid-area: field;\n  letter-spacing: var(--pine-letter-spacing);\n  min-height: var(--pds-select-min-height);\n  padding: calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150);\n  padding-inline-end: var(--pine-dimension-450);\n  position: relative;\n\n  &:hover {\n    border-color: var(--pine-color-border-hover);\n    cursor: pointer;\n  }\n\n  &:focus-visible {\n    border-color: var(--pine-color-border-active);\n    outline: var(--pine-outline-focus);\n    outline-offset: var(--pine-border-width);\n  }\n\n  &:disabled {\n    background-color: var(--pine-color-background-container-disabled);\n    border-color: var(--pine-color-border-disabled);\n    color: var(--pine-color-text-disabled);\n    cursor: not-allowed;\n  }\n\n  &:has(~ .pds-select__message .pds-select__error-message) {\n    background-color: var(--pine-select-color-background-danger);\n    border-color: var(--pine-color-border-danger);\n\n    &:focus-visible {\n      outline-color: var(--pine-color-focus-ring-danger);\n    }\n  }\n}\n\n:host(.is-invalid) {\n  select {\n    background-color: var(--pine-select-color-background-danger);\n    border-color: var(--pine-color-border-danger);\n\n    &:focus-visible {\n      outline-color: var(--pine-color-focus-ring-danger);\n    }\n  }\n}\n\n.pds-select__error-message,\n.pds-select__helper-message {\n  color: var(--pine-color-text-message);\n  font: var(--pine-typography-body-sm-medium);\n  margin-block-end: 0;\n  margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-select__error-message {\n  align-items: center;\n  color: var(--pine-color-text-message-danger);\n  display: flex;\n  gap: var(--pine-dimension-2xs);\n}\n\n.pds-select__message {\n  grid-area: message;\n}\n\n.pds-select__select-icon {\n  align-items: center;\n  display: flex;\n  grid-column: -1 / -2;\n  grid-row: 2 / 3;\n  height: var(--pds-select-min-height);\n  pointer-events: none;\n  position: relative;\n  z-index: 1;\n}\n\n.visually-hidden {\n  border: 0;\n  clip: rect(0 0 0 0);\n  clip-path: polygon(0 0, 0 0, 0 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n","import { Component, Element, Event, EventEmitter, Host, h, Prop, Watch } from '@stencil/core';\nimport { messageId } from '../../utils/form';\nimport { danger, enlarge } from '@pine-ds/icons/icons';\n\n/**\n * @slot action - Content to be displayed in the label area, typically for help icons or links\n */\n@Component({\n  tag: 'pds-select',\n  styleUrls: ['pds-select.tokens.scss', '../../global/styles/utils/label.scss', 'pds-select.scss'],\n  shadow: true,\n  formAssociated: true,\n})\nexport class PdsSelect {\n\n  private selectEl!: HTMLSelectElement;\n  private slotContainer!: HTMLDivElement;\n  private internals?: ElementInternals;\n\n  @Element() el: HTMLPdsSelectElement;\n\n  /**\n   * Specifies if and how the browser provides `autocomplete` assistance for the field.\n   */\n  @Prop() autocomplete: string;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Indicates whether or not the select field is disabled.\n   * @defaultValue false\n   */\n  @Prop() disabled = false\n\n  /**\n   * Displays error message text describing an invalid state.\n   */\n  @Prop() errorMessage: string;\n\n  /**\n   * Visually hides the label text for instances where only the select should be displayed. Label remains accessible to assistive technology such as screen readers.\n   * Note: When true, the action slot is also hidden to maintain a minimal UI.\n   */\n  @Prop() hideLabel: boolean;\n\n  /**\n   * Displays helper message text below select.\n   */\n  @Prop() helperMessage: string;\n\n  /**\n   * Determines whether or not the select is invalid.\n   */\n  @Prop() invalid?: boolean;\n\n  /**\n   * Text to be displayed as the select label.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Indicates whether multiple options can be selected.\n   * @defaultValue false\n   */\n  @Prop() multiple = false;\n\n  /**\n   * Specifies the name. Submitted with the form name/value pair.\n   */\n  @Prop() name!: string;\n\n  /**\n   * Indicates whether or not the select field is required.\n   * @defaultValue false\n   */\n  @Prop() required = false;\n\n  /**\n   * The value(s) of the selected option(s).\n   *\n   */\n  @Prop({ mutable: true }) value?: string | string[];\n\n  /**\n   * Emitted when a keyboard input occurs.\n   */\n  @Event() pdsSelectChange: EventEmitter<InputEvent>;\n\n  @Watch('value')\n  /**\n   * Handles the change in the value of the select component.\n   * This method is called whenever the value of the select component changes.\n   * It updates the selected option accordingly.\n   */\n  valueChanged() {\n    this.updateSelectedOption();\n    this.updateFormValue();\n  }\n\n  connectedCallback() {\n    // Initialize ElementInternals for form association\n    if (this.el.attachInternals) {\n      this.internals = this.el.attachInternals();\n    }\n  }\n\n  componentWillLoad() {\n    this.updateSelectedOption();\n  }\n\n  componentDidLoad() {\n    // Set initial form value\n    this.updateFormValue();\n  }\n\n  /**\n   * Updates the selected option in the select element based on the current value.\n   *\n   * This method iterates through all the options of the select element and sets the\n   * 'selected' attribute on the option that matches the current value. If an option\n   * does not match the current value, the 'selected' attribute is removed.\n   *\n   * @private\n   * @returns {void}\n   */\n  private updateSelectedOption() {\n    if (this.selectEl) {\n      const options = this.selectEl.options;\n\n      // Update the selected attribute for all options.\n      Array.from(options).map((option: HTMLOptionElement) => {\n        if (Array.isArray(this.value)) {\n          option.selected = this.value.includes(option.value);\n        } else {\n          option.selected = this.value === option.value;\n        }\n      });\n    };\n  }\n\n  /**\n   * Emits an event on input change.\n  */\n  private onSelectUpdate = (e: Event) => {\n    const target = e.target as HTMLSelectElement\n\n    const values = Array.from(target.options)\n        .filter((option) => ( option.selected))\n        .map((option) => ( option.value));\n\n    if (values.length === 1 && !this.multiple) {\n        this.value = values[0];\n    } else {\n        this.value = values;\n    }\n\n    this.pdsSelectChange.emit(e as InputEvent);\n  };\n\n  /**\n   * Handles the change event for the slot element.\n   * This method is triggered when the slot content changes.\n   * It updates the inner HTML of the select element by cloning and appending\n   * the assigned <option> elements from the slot.\n   */\n  private handleSlotChange = () => {\n    const slot = this.slotContainer.querySelector('slot') as HTMLSlotElement;\n\n    this.selectEl.innerHTML = '';\n    const assignedElements = slot.assignedElements({ flatten: true }) as (HTMLOptionElement | HTMLOptGroupElement)[];\n\n    assignedElements.forEach((item) => {\n      if ( ['OPTION', 'OPTGROUP'].includes(item.tagName)) {\n        const clonedItem = item.cloneNode(true) as HTMLOptionElement | HTMLOptGroupElement;\n        if (clonedItem.tagName === 'OPTION' && (clonedItem as HTMLOptionElement).value === this.value) {\n          (clonedItem as HTMLOptionElement).selected = true;\n        }\n        this.selectEl.appendChild(clonedItem);\n      }\n    });\n\n    this.updateSelectedOption();\n  };\n\n  private getHelperMessage() {\n    return this.helperMessage && (\n      <p class=\"pds-select__helper-message\" id={messageId(this.componentId, 'helper')}>\n        {this.helperMessage}\n      </p>\n    );\n  }\n\n  private getErrorMessage() {\n    return this.errorMessage && (\n      <p class=\"pds-select__error-message\" id={messageId(this.componentId, 'error')} aria-live=\"assertive\">\n        <pds-icon icon={danger} size=\"small\"></pds-icon>\n        {this.errorMessage}\n      </p>\n    );\n  }\n\n  private renderMessages() {\n    if (!this.helperMessage && !this.errorMessage) return null;\n\n    return (\n      <div class=\"pds-select__message\">\n        {this.getHelperMessage()}\n        {this.getErrorMessage()}\n      </div>\n    );\n  }\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.invalid) { classNames.push('is-invalid'); }\n    if (this.disabled) { classNames.push('is-disabled'); }\n\n    return classNames.join('  ');\n  }\n\n  private renderAction() {\n    const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n    if (hasAction) {\n      return (\n        <div class=\"pds-select__action\" part=\"action\">\n          <slot name=\"action\"></slot>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  /**\n   * Updates the form value using ElementInternals API\n   */\n  private updateFormValue() {\n    if (this.internals && this.internals.setFormValue) {\n      const value = this.value;\n\n      // Handle multi-select arrays by converting to FormData or comma-separated string\n      if (Array.isArray(value)) {\n        if (value.length > 1) {\n          // For multiple values, create FormData with multiple entries\n          const formData = new FormData();\n          value.forEach(val => formData.append(this.name || '', val));\n          this.internals.setFormValue(formData);\n        } else {\n          // Single value in array, use the string value\n          this.internals.setFormValue(value[0] || null);\n        }\n      } else {\n        // Single string value\n        this.internals.setFormValue(value || null);\n      }\n\n      // Set validity based on native select validation\n      if (this.selectEl && this.internals && this.internals.setValidity) {\n        this.internals.setValidity(\n          this.selectEl.validity,\n          this.selectEl.validationMessage,\n          this.selectEl\n        );\n      }\n    }\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called when the form is reset\n   */\n  formResetCallback() {\n    this.value = '';\n    this.updateFormValue();\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called when the form is disabled\n   */\n  formDisabledCallback(disabled: boolean) {\n    this.disabled = disabled;\n  }\n\n  /**\n   * Form Associated Custom Elements API: Called to restore form state\n   */\n  formStateRestoreCallback(state: string | FormData | null) {\n    if (typeof state === 'string') {\n      this.value = state;\n    } else if (state instanceof FormData && this.name) {\n      // Extract value(s) from FormData using the select's name\n      const values = state.getAll(this.name);\n      if (values.length > 1) {\n        // Multi-select: convert to string array\n        this.value = values.filter(v => typeof v === 'string') as string[];\n      } else if (values.length === 1 && typeof values[0] === 'string') {\n        // Single select: use string value\n        this.value = values[0];\n      }\n    }\n  }\n\n  render() {\n    const hasAction = this.el.querySelector('[slot=\"action\"]') !== null;\n\n    return (\n      <Host aria-disabled={this.disabled ? 'true' : null} class={this.classNames()} has-action={hasAction && !this.hideLabel ? 'true' : null}>\n        <div class=\"pds-select\">\n          {!this.hideLabel && (\n            <div class=\"pds-select__label-wrapper\">\n              <label htmlFor={this.componentId}>\n                <span class={this.hideLabel ? 'visually-hidden' : ''}>\n                  {this.label}\n                </span>\n              </label>\n              {hasAction && this.renderAction()}\n            </div>\n          )}\n          <select\n            aria-label={this.hideLabel ? this.label : undefined}\n            autocomplete={this.autocomplete || undefined}\n            class=\"pds-select__field\"\n            disabled={this.disabled}\n            id={this.componentId}\n            multiple={this.multiple}\n            name={this.name}\n            onChange={this.onSelectUpdate}\n            part=\"select\"\n            required={this.required}\n            ref={(el) => (this.selectEl = el as HTMLSelectElement)}\n          ></select>\n          <div aria-hidden=\"true\" class=\"hidden\" ref={(el) => (this.slotContainer = el)}>\n            <slot onSlotchange={this.handleSlotChange}></slot>\n          </div>\n          {this.renderMessages()}\n          {!this.multiple && <pds-icon class=\"pds-select__select-icon\" icon={enlarge} />}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pine-core/p-265372d3.entry.js

@@ -1,2 +0,0 @@
-import{r as e,h as o,H as t,g as r}from"./p-Bf1dou5H.js";const i=":host{--sizing-max-width-default:352px;display:inline-block}:host [popover]{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow-200);box-shadow:var(--pine-box-shadow-200);margin:var(--pine-dimension-none);max-width:var(--sizing-max-width-default);padding:var(--pine-dimension-md);position:fixed}:host button{-ms-flex-align:center;align-items:center;background-color:var(--pine-color-secondary);border:var(--pine-border);border-radius:var(--pine-border-radius-full);color:var(--pine-color-text-secondary);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);font-family:var(--pine-font-family-heading);letter-spacing:var(--pine-letter-spacing);min-height:40px;padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}:host button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}:host button:hover{background-color:var(--pine-color-secondary-hover)}";const a=class{constructor(o){e(this,o);this.active=false;this.popoverTargetAction="show";this.popoverType="auto";this.maxWidth=352;this.placement="right"}componentWillRender(){this.handlePopoverPositioning()}handleClick(){this.active=!this.active}handleScroll(){if(this.active){this.handlePopoverPositioning()}}handlePopoverPositioning(){const e=this.el.shadowRoot.querySelector(".pds-popover__trigger");const o=this.el.shadowRoot.querySelector("div[popover]");if(!e||!o)return;const t=e.getBoundingClientRect();const r=o.getBoundingClientRect();let i=0;let a=0;const s=8;switch(this.placement){case"top":i=t.top-r.height-s;a=t.left+(t.width-r.width)/2;break;case"top-start":i=t.top-r.height-s;a=t.left;break;case"top-end":i=t.top-r.height-s;a=t.right-r.width;break;case"right":i=t.top+(t.height-r.height)/2;a=t.right+s;break;case"right-start":i=t.top;a=t.right+s;break;case"right-end":i=t.bottom-r.height;a=t.right+s;break;case"bottom":i=t.bottom+s;a=t.left+(t.width-r.width)/2;break;case"bottom-start":i=t.bottom+s;a=t.left;break;case"bottom-end":i=t.bottom+s;a=t.right-r.width;break;case"left":i=t.top+(t.height-r.height)/2;a=t.left-r.width-s;break;case"left-start":i=t.top;a=t.left-r.width-s;break;case"left-end":i=t.bottom-r.height;a=t.left-r.width-s;break}o.style.top=`${i}px`;o.style.left=`${a}px`}render(){return o(t,{key:"f31ca22bbebb2df24412cfab4660e6953d35d65c"},o("button",{key:"74e0c9b393df28138b7f4c11d15e7fc4c6b8de14",class:"pds-popover__trigger",popoverTarget:this.componentId,popoverTargetAction:this.popoverTargetAction,onClick:this.handleClick},this.text),o("div",{key:"0f4d6e601cb4e9d2c890261a72ce92725fa62846",class:`pds-popover ${this.active?"pds-popover--active":""}`,id:this.componentId,popover:this.popoverType,style:{maxWidth:`${this.maxWidth}px`}},o("slot",{key:"8ab8d2f7de3a175d73f3bfa7d42a84431a82bef1"})))}get el(){return r(this)}};a.style=i;export{a as pds_popover};
-//# sourceMappingURL=p-265372d3.entry.js.map

package/dist/pine-core/p-265372d3.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsPopoverCss","PdsPopover","constructor","hostRef","this","active","popoverTargetAction","popoverType","maxWidth","placement","componentWillRender","handlePopoverPositioning","handleClick","handleScroll","triggerEl","el","shadowRoot","querySelector","popoverEl","triggerRect","getBoundingClientRect","popoverRect","top","left","offset","height","width","right","bottom","style","render","h","Host","key","class","popoverTarget","componentId","onClick","text","id","popover"],"sources":["src/components/pds-popover/pds-popover.scss?tag=pds-popover&encapsulation=shadow","src/components/pds-popover/pds-popover.tsx"],"sourcesContent":[":host {\n  --sizing-max-width-default: 352px;\n\n  display: inline-block;\n\n  [popover] {\n    background-color: var(--pine-color-background-container);\n    border: var(--pine-border);\n    border-radius: var(--pine-dimension-125);\n    box-shadow: var(--pine-box-shadow-200);\n    margin: var(--pine-dimension-none);\n    max-width: var(--sizing-max-width-default);\n    padding: var(--pine-dimension-md);\n    position: fixed;\n  }\n\n  button {\n    align-items: center;\n    background-color: var(--pine-color-secondary);\n    border: var(--pine-border);\n    border-radius: var(--pine-border-radius-full);\n    color: var(--pine-color-text-secondary);\n    display: flex;\n    font: var(--pine-typography-body-medium);\n    font-family: var(--pine-font-family-heading);\n    letter-spacing: var(--pine-letter-spacing);\n    min-height: 40px;\n    padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n    &:focus-visible {\n      outline: var(--pine-outline-focus);\n      outline-offset: var(--pine-border-width);\n    }\n\n    &:hover {\n      background-color: var(--pine-color-secondary-hover);\n    }\n  }\n}\n","import { Component, Element, Host, Listen, h, Prop, State } from '@stencil/core';\nimport { PlacementType } from '@utils/types';\n\n@Component({\n  tag: 'pds-popover',\n  styleUrl: 'pds-popover.scss',\n  shadow: true,\n})\nexport class PdsPopover {\n  /**\n   * Reference to the Host element\n   */\n  @Element() el: HTMLPdsPopoverElement;\n\n  /**\n   * Determines when the popover is active\n   * @defaultValue false\n   */\n  @State() active = false;\n\n  /**\n   * Determines the action that triggers the popover. For manual popovers, the consumer is responsible for toggling this value.\n   * @defaultValue \"show\"\n   */\n  @Prop() popoverTargetAction: 'show' | 'toggle' | 'hide' = 'show';\n\n  /**\n   * Determines the type of popover. Auto popovers can be \"light dismissed\" by clicking outside of the popover.\n   * Manual popovers require the consumer to handle the visibility of the popover.\n   */\n  @Prop() popoverType: 'auto' | 'manual' = 'auto';\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Text that appears on the trigger element\n   */\n  @Prop() text: string;\n\n  /**\n   * Sets the maximum width of the popover content\n   * @defaultValue 352\n   */\n  @Prop() maxWidth?: number = 352;\n\n  /**\n   * Determines the preferred position of the popover\n   * @defaultValue \"right\"\n   */\n  @Prop({ reflect: true }) placement: PlacementType = 'right';\n\n  componentWillRender() {\n    this.handlePopoverPositioning();\n  }\n\n  @Listen('click', {\n    capture: true\n  })\n  handleClick() {\n    this.active = !this.active;\n  }\n\n  @Listen('scroll', {\n    target: 'window',\n    capture: true\n  })\n  handleScroll() {\n    if (this.active) {\n      this.handlePopoverPositioning();\n    }\n  }\n\n  private handlePopoverPositioning() {\n    const triggerEl = this.el.shadowRoot.querySelector('.pds-popover__trigger') as HTMLElement;\n    const popoverEl = this.el.shadowRoot.querySelector('div[popover]') as HTMLElement;\n\n    if (!triggerEl || !popoverEl) return;\n\n    const triggerRect = triggerEl.getBoundingClientRect();\n    const popoverRect = popoverEl.getBoundingClientRect();\n\n    let top = 0;\n    let left = 0;\n    const offset = 8\n\n    switch (this.placement) {\n      case 'top':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;\n        break;\n      case 'top-start':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.left;\n        break;\n      case 'top-end':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.right - popoverRect.width;\n        break;\n      case 'right':\n        top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;\n        left = triggerRect.right + offset;\n        break;\n      case 'right-start':\n        top = triggerRect.top;\n        left = triggerRect.right + offset;\n        break;\n      case 'right-end':\n        top = triggerRect.bottom - popoverRect.height;\n        left = triggerRect.right + offset;\n        break;\n      case 'bottom':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;\n        break;\n      case 'bottom-start':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.left;\n        break;\n      case 'bottom-end':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.right - popoverRect.width;\n        break;\n      case 'left':\n        top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n      case 'left-start':\n        top = triggerRect.top;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n      case 'left-end':\n        top = triggerRect.bottom - popoverRect.height;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n    }\n\n    popoverEl.style.top = `${top}px`;\n    popoverEl.style.left = `${left}px`;\n  }\n\n  render() {\n    return (\n      <Host>\n        <button\n          class=\"pds-popover__trigger\"\n          popoverTarget={this.componentId}\n          popoverTargetAction={this.popoverTargetAction}\n          onClick={this.handleClick}\n        >\n          {this.text}\n        </button>\n        <div\n          class={`pds-popover ${this.active ? 'pds-popover--active' : ''}`}\n          id={this.componentId}\n          popover={this.popoverType}\n          style={{ maxWidth: `${this.maxWidth}px` }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,8/B,MCQTC,EAAU,MALvB,WAAAC,CAAAC,G,UAeWC,KAAMC,OAAG,MAMVD,KAAmBE,oBAA+B,OAMlDF,KAAWG,YAAsB,OAgBjCH,KAAQI,SAAY,IAMHJ,KAASK,UAAkB,OAiHrD,CA/GC,mBAAAC,GACEN,KAAKO,0B,CAMP,WAAAC,GACER,KAAKC,QAAUD,KAAKC,M,CAOtB,YAAAQ,GACE,GAAIT,KAAKC,OAAQ,CACfD,KAAKO,0B,EAID,wBAAAA,GACN,MAAMG,EAAYV,KAAKW,GAAGC,WAAWC,cAAc,yBACnD,MAAMC,EAAYd,KAAKW,GAAGC,WAAWC,cAAc,gBAEnD,IAAKH,IAAcI,EAAW,OAE9B,MAAMC,EAAcL,EAAUM,wBAC9B,MAAMC,EAAcH,EAAUE,wBAE9B,IAAIE,EAAM,EACV,IAAIC,EAAO,EACX,MAAMC,EAAS,EAEf,OAAQpB,KAAKK,WACX,IAAK,MACHa,EAAMH,EAAYG,IAAMD,EAAYI,OAASD,EAC7CD,EAAOJ,EAAYI,MAAQJ,EAAYO,MAAQL,EAAYK,OAAS,EACpE,MACF,IAAK,YACHJ,EAAMH,EAAYG,IAAMD,EAAYI,OAASD,EAC7CD,EAAOJ,EAAYI,KACnB,MACF,IAAK,UACHD,EAAMH,EAAYG,IAAMD,EAAYI,OAASD,EAC7CD,EAAOJ,EAAYQ,MAAQN,EAAYK,MACvC,MACF,IAAK,QACHJ,EAAMH,EAAYG,KAAOH,EAAYM,OAASJ,EAAYI,QAAU,EACpEF,EAAOJ,EAAYQ,MAAQH,EAC3B,MACF,IAAK,cACHF,EAAMH,EAAYG,IAClBC,EAAOJ,EAAYQ,MAAQH,EAC3B,MACF,IAAK,YACHF,EAAMH,EAAYS,OAASP,EAAYI,OACvCF,EAAOJ,EAAYQ,MAAQH,EAC3B,MACF,IAAK,SACHF,EAAMH,EAAYS,OAASJ,EAC3BD,EAAOJ,EAAYI,MAAQJ,EAAYO,MAAQL,EAAYK,OAAS,EACpE,MACF,IAAK,eACHJ,EAAMH,EAAYS,OAASJ,EAC3BD,EAAOJ,EAAYI,KACnB,MACF,IAAK,aACHD,EAAMH,EAAYS,OAASJ,EAC3BD,EAAOJ,EAAYQ,MAAQN,EAAYK,MACvC,MACF,IAAK,OACHJ,EAAMH,EAAYG,KAAOH,EAAYM,OAASJ,EAAYI,QAAU,EACpEF,EAAOJ,EAAYI,KAAOF,EAAYK,MAAQF,EAC9C,MACF,IAAK,aACHF,EAAMH,EAAYG,IAClBC,EAAOJ,EAAYI,KAAOF,EAAYK,MAAQF,EAC9C,MACF,IAAK,WACHF,EAAMH,EAAYS,OAASP,EAAYI,OACvCF,EAAOJ,EAAYI,KAAOF,EAAYK,MAAQF,EAC9C,MAGJN,EAAUW,MAAMP,IAAM,GAAGA,MACzBJ,EAAUW,MAAMN,KAAO,GAAGA,K,CAG5B,MAAAO,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EACE,UAAAE,IAAA,2CAAAC,MAAM,uBACNC,cAAe/B,KAAKgC,YACpB9B,oBAAqBF,KAAKE,oBAC1B+B,QAASjC,KAAKQ,aAEbR,KAAKkC,MAERP,EAAA,OAAAE,IAAA,2CACEC,MAAO,eAAe9B,KAAKC,OAAS,sBAAwB,KAC5DkC,GAAInC,KAAKgC,YACTI,QAASpC,KAAKG,YACdsB,MAAO,CAAErB,SAAU,GAAGJ,KAAKI,eAE3BuB,EAAa,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/pine-core/p-29b2af94.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as s,H as o,g as c}from"./p-Bf1dou5H.js";import{c as i}from"./p-DnUJodVd.js";const a=":host{--color-background-interactive:var(--pine-color-grey-200);border-color:inherit;display:table-row;vertical-align:inherit}:host::part(checkbox-cell){background-color:var(--pine-color-background-container);inset-inline-start:var(--pine-dimension-none);position:-webkit-sticky;position:sticky;z-index:1}:host(:hover),:host(:hover)::part(checkbox-cell),:host(:hover) ::slotted(pds-table-cell),:host(.is-selected),:host(.is-selected)::part(checkbox-cell),:host(.is-selected) ::slotted(pds-table-cell){background:var(--color-background-interactive)}";const l=class{constructor(s){e(this,s);this.pdsTableRowSelected=t(this,"pdsTableRowSelected");this.handleClick=()=>{this.isSelected=!this.isSelected;this.handleSelect(this.isSelected)};this.handleSelect=e=>{this.indeterminate=false;if(!i("pds-table-head",this.hostElement)){const t=Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement);this.pdsTableRowSelected.emit({rowIndex:t,isSelected:e})}};this.generateUniqueId=()=>{const e=Math.random().toString(36).substring(2,8);const t=(new Date).toISOString().replace(/[:.]/g,"-");const s=`${e}-${t}`;return s}}classNames(){const e=[];if(this.isSelected){e.push("is-selected")}return e.join("  ")}componentWillRender(){this.tableRef=this.hostElement.closest("pds-table");if(this.tableRef&&this.tableRef.fixedColumn){const e=this.hostElement.querySelector("pds-table-cell");e===null||e===void 0?void 0:e.classList.add("is-fixed")}}componentWillLoad(){if(this.isSelected){this.handleSelect(this.isSelected)}}render(){return s(o,{key:"cffeb199c48f2a06af70a2e5a5b41a21649c24c7",class:this.classNames(),role:"row",part:"row"},this.tableRef&&this.tableRef.selectable&&s("pds-table-cell",{key:"02a80cd54efe360550e636f7bc0f11e3de59af1c",part:this.tableRef.fixedColumn?"checkbox-cell":"checkbox-cell",class:this.tableRef.selectable?"has-checkbox":""},s("pds-checkbox",{key:"a8cd6c303ec35f71e0a97f130c5d53a2e81a3e4a",componentId:this.generateUniqueId(),onClick:this.handleClick,indeterminate:this.indeterminate,label:"Select Row",hideLabel:true,checked:this.isSelected,part:"row-checkbox"})),s("slot",{key:"820a502627ffc329f650f7f0110e34ae3f096357"}))}get hostElement(){return c(this)}};l.style=a;export{l as pds_table_row};
-//# sourceMappingURL=p-29b2af94.entry.js.map

package/dist/pine-core/p-29b2af94.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTableRowCss","PdsTableRow","constructor","hostRef","this","handleClick","isSelected","handleSelect","indeterminate","closest","hostElement","rowIndex","Array","from","parentNode","children","indexOf","pdsTableRowSelected","emit","generateUniqueId","randomString","Math","random","toString","substring","timestamp","Date","toISOString","replace","uniqueId","classNames","push","join","componentWillRender","tableRef","fixedColumn","tableCell","querySelector","classList","add","componentWillLoad","render","h","Host","key","class","role","part","selectable","componentId","onClick","label","hideLabel","checked"],"sources":["src/components/pds-table/pds-table-row/pds-table-row.scss?tag=pds-table-row&encapsulation=shadow","src/components/pds-table/pds-table-row/pds-table-row.tsx"],"sourcesContent":[":host {\n  --color-background-interactive: var(--pine-color-grey-200);\n\n  border-color: inherit;\n  display: table-row;\n  vertical-align: inherit;\n\n  // used for pds-checkbox-cell\n  // because it is in the ShadowDom\n  &::part(checkbox-cell) {\n    background-color: var(--pine-color-background-container);\n    inset-inline-start: var(--pine-dimension-none);\n    position: sticky;\n    z-index: 1;\n  }\n}\n\n:host(:hover),\n:host(:hover)::part(checkbox-cell),\n:host(:hover) ::slotted(pds-table-cell),\n:host(.is-selected),\n:host(.is-selected)::part(checkbox-cell),\n:host(.is-selected) ::slotted(pds-table-cell) {\n  background: var(--color-background-interactive);\n}\n","import { Component, Element, Host, h, Event, EventEmitter, Prop } from '@stencil/core';\n\nimport { closest } from '../../../utils/closest';\n\n@Component({\n  tag: 'pds-table-row',\n  styleUrls: ['pds-table-row.scss'],\n  shadow: true,\n})\nexport class PdsTableRow {\n  @Element() hostElement: HTMLPdsTableRowElement;\n  private tableRef: HTMLPdsTableElement;\n\n  /**\n    * Determines if the row selected is in an indeterminate state.\n    */\n  @Prop({ mutable: true }) indeterminate?: boolean;\n\n  /**\n   * Determines if the table row is currently selected.\n   */\n  @Prop({ mutable: true }) isSelected?: boolean;\n\n  /**\n   * Event that is emitted when the checkbox is clicked, carrying the selected value.\n   */\n  @Event() pdsTableRowSelected: EventEmitter<{ rowIndex: number; isSelected: boolean; }>;\n\n  private handleClick = () => {\n    this.isSelected = !this.isSelected; // Toggle the selected state\n    this.handleSelect(this.isSelected);\n  }\n\n  private handleSelect = (isSelected: boolean) => {\n    this.indeterminate = false;\n\n    if (!closest('pds-table-head', this.hostElement)) {\n      const rowIndex = Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement)\n      this.pdsTableRowSelected.emit({\n        rowIndex,\n        isSelected,\n      })\n    }\n  }\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.isSelected) {\n      classNames.push(\"is-selected\");\n    }\n\n    return classNames.join('  ');\n  }\n\n  componentWillRender() {\n    this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n\n    if (this.tableRef && this.tableRef.fixedColumn) {\n      const tableCell = this.hostElement.querySelector('pds-table-cell');\n      tableCell?.classList.add(\"is-fixed\");\n    }\n  }\n\n  componentWillLoad() {\n    if (this.isSelected) {\n      this.handleSelect(this.isSelected);\n    }\n  }\n\n  private generateUniqueId = () => {\n    const randomString = Math.random().toString(36).substring(2, 8);\n    const timestamp = new Date().toISOString().replace(/[:.]/g, '-');\n    const uniqueId = `${randomString}-${timestamp}`;\n\n    return uniqueId;\n  }\n\n  render() {\n    return (\n      <Host\n        class={this.classNames()}\n        role=\"row\"\n        part=\"row\"\n      >\n        {this.tableRef && this.tableRef.selectable && (\n          <pds-table-cell part={this.tableRef.fixedColumn ? 'checkbox-cell' : 'checkbox-cell'} class={this.tableRef.selectable ? 'has-checkbox' : ''} >\n            <pds-checkbox\n              componentId={this.generateUniqueId()}\n              onClick={this.handleClick}\n              indeterminate={this.indeterminate}\n              label={\"Select Row\"}\n              hideLabel={true}\n              checked={this.isSelected}\n              part=\"row-checkbox\"\n            />\n          </pds-table-cell>\n        )}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAiB,uiB,MCSVC,EAAW,MALxB,WAAAC,CAAAC,G,iEAwBUC,KAAWC,YAAG,KACpBD,KAAKE,YAAcF,KAAKE,WACxBF,KAAKG,aAAaH,KAAKE,WAAW,EAG5BF,KAAAG,aAAgBD,IACtBF,KAAKI,cAAgB,MAErB,IAAKC,EAAQ,iBAAkBL,KAAKM,aAAc,CAChD,MAAMC,EAAWC,MAAMC,KAAKT,KAAKM,YAAYI,WAAWC,UAAUC,QAAQZ,KAAKM,aAC/EN,KAAKa,oBAAoBC,KAAK,CAC5BP,WACAL,c,GA8BEF,KAAgBe,iBAAG,KACzB,MAAMC,EAAeC,KAAKC,SAASC,SAAS,IAAIC,UAAU,EAAG,GAC7D,MAAMC,GAAY,IAAIC,MAAOC,cAAcC,QAAQ,QAAS,KAC5D,MAAMC,EAAW,GAAGT,KAAgBK,IAEpC,OAAOI,CAAQ,CA2BlB,CAzDS,UAAAC,GACN,MAAMA,EAAa,GAEnB,GAAI1B,KAAKE,WAAY,CACnBwB,EAAWC,KAAK,c,CAGlB,OAAOD,EAAWE,KAAK,K,CAGzB,mBAAAC,GACE7B,KAAK8B,SAAW9B,KAAKM,YAAYD,QAAQ,aAEzC,GAAIL,KAAK8B,UAAY9B,KAAK8B,SAASC,YAAa,CAC9C,MAAMC,EAAYhC,KAAKM,YAAY2B,cAAc,kBACjDD,IAAS,MAATA,SAAS,SAATA,EAAWE,UAAUC,IAAI,W,EAI7B,iBAAAC,GACE,GAAIpC,KAAKE,WAAY,CACnBF,KAAKG,aAAaH,KAAKE,W,EAY3B,MAAAmC,GACE,OACEC,EAACC,EACC,CAAAC,IAAA,2CAAAC,MAAOzC,KAAK0B,aACZgB,KAAK,MACLC,KAAK,OAEJ3C,KAAK8B,UAAY9B,KAAK8B,SAASc,YAC9BN,EAAA,kBAAAE,IAAA,2CAAgBG,KAAM3C,KAAK8B,SAASC,YAAc,gBAAkB,gBAAiBU,MAAOzC,KAAK8B,SAASc,WAAa,eAAiB,IACtIN,EAAA,gBAAAE,IAAA,2CACEK,YAAa7C,KAAKe,mBAClB+B,QAAS9C,KAAKC,YACdG,cAAeJ,KAAKI,cACpB2C,MAAO,aACPC,UAAW,KACXC,QAASjD,KAAKE,WACdyC,KAAK,kBAIXL,EAAa,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/pine-core/p-2b452883.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-Cxvdulqq.system.js"],(function(e){"use strict";var r,t,i,o;return{setters:[function(e){r=e.r;t=e.h;i=e.H;o=e.g}],execute:function(){var a=":host{--sizing-max-width-default:352px;display:inline-block}:host [popover]{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow-200);box-shadow:var(--pine-box-shadow-200);margin:var(--pine-dimension-none);max-width:var(--sizing-max-width-default);padding:var(--pine-dimension-md);position:fixed}:host button{-ms-flex-align:center;align-items:center;background-color:var(--pine-color-secondary);border:var(--pine-border);border-radius:var(--pine-border-radius-full);color:var(--pine-color-text-secondary);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);font-family:var(--pine-font-family-heading);letter-spacing:var(--pine-letter-spacing);min-height:40px;padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}:host button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}:host button:hover{background-color:var(--pine-color-secondary-hover)}";var n=e("pds_popover",function(){function e(e){r(this,e);this.active=false;this.popoverTargetAction="show";this.popoverType="auto";this.maxWidth=352;this.placement="right"}e.prototype.componentWillRender=function(){this.handlePopoverPositioning()};e.prototype.handleClick=function(){this.active=!this.active};e.prototype.handleScroll=function(){if(this.active){this.handlePopoverPositioning()}};e.prototype.handlePopoverPositioning=function(){var e=this.el.shadowRoot.querySelector(".pds-popover__trigger");var r=this.el.shadowRoot.querySelector("div[popover]");if(!e||!r)return;var t=e.getBoundingClientRect();var i=r.getBoundingClientRect();var o=0;var a=0;var n=8;switch(this.placement){case"top":o=t.top-i.height-n;a=t.left+(t.width-i.width)/2;break;case"top-start":o=t.top-i.height-n;a=t.left;break;case"top-end":o=t.top-i.height-n;a=t.right-i.width;break;case"right":o=t.top+(t.height-i.height)/2;a=t.right+n;break;case"right-start":o=t.top;a=t.right+n;break;case"right-end":o=t.bottom-i.height;a=t.right+n;break;case"bottom":o=t.bottom+n;a=t.left+(t.width-i.width)/2;break;case"bottom-start":o=t.bottom+n;a=t.left;break;case"bottom-end":o=t.bottom+n;a=t.right-i.width;break;case"left":o=t.top+(t.height-i.height)/2;a=t.left-i.width-n;break;case"left-start":o=t.top;a=t.left-i.width-n;break;case"left-end":o=t.bottom-i.height;a=t.left-i.width-n;break}r.style.top="".concat(o,"px");r.style.left="".concat(a,"px")};e.prototype.render=function(){return t(i,{key:"f31ca22bbebb2df24412cfab4660e6953d35d65c"},t("button",{key:"74e0c9b393df28138b7f4c11d15e7fc4c6b8de14",class:"pds-popover__trigger",popoverTarget:this.componentId,popoverTargetAction:this.popoverTargetAction,onClick:this.handleClick},this.text),t("div",{key:"0f4d6e601cb4e9d2c890261a72ce92725fa62846",class:"pds-popover ".concat(this.active?"pds-popover--active":""),id:this.componentId,popover:this.popoverType,style:{maxWidth:"".concat(this.maxWidth,"px")}},t("slot",{key:"8ab8d2f7de3a175d73f3bfa7d42a84431a82bef1"})))};Object.defineProperty(e.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});return e}());n.style=a}}}));
-//# sourceMappingURL=p-2b452883.system.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["pdsPopoverCss","PdsPopover","exports","class_1","hostRef","this","active","popoverTargetAction","popoverType","maxWidth","placement","prototype","componentWillRender","handlePopoverPositioning","handleClick","handleScroll","triggerEl","el","shadowRoot","querySelector","popoverEl","triggerRect","getBoundingClientRect","popoverRect","top","left","offset","height","width","right","bottom","style","concat","render","h","Host","key","class","popoverTarget","componentId","onClick","text","id","popover"],"sources":["src/components/pds-popover/pds-popover.scss?tag=pds-popover&encapsulation=shadow","src/components/pds-popover/pds-popover.tsx"],"sourcesContent":[":host {\n  --sizing-max-width-default: 352px;\n\n  display: inline-block;\n\n  [popover] {\n    background-color: var(--pine-color-background-container);\n    border: var(--pine-border);\n    border-radius: var(--pine-dimension-125);\n    box-shadow: var(--pine-box-shadow-200);\n    margin: var(--pine-dimension-none);\n    max-width: var(--sizing-max-width-default);\n    padding: var(--pine-dimension-md);\n    position: fixed;\n  }\n\n  button {\n    align-items: center;\n    background-color: var(--pine-color-secondary);\n    border: var(--pine-border);\n    border-radius: var(--pine-border-radius-full);\n    color: var(--pine-color-text-secondary);\n    display: flex;\n    font: var(--pine-typography-body-medium);\n    font-family: var(--pine-font-family-heading);\n    letter-spacing: var(--pine-letter-spacing);\n    min-height: 40px;\n    padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n    &:focus-visible {\n      outline: var(--pine-outline-focus);\n      outline-offset: var(--pine-border-width);\n    }\n\n    &:hover {\n      background-color: var(--pine-color-secondary-hover);\n    }\n  }\n}\n","import { Component, Element, Host, Listen, h, Prop, State } from '@stencil/core';\nimport { PlacementType } from '@utils/types';\n\n@Component({\n  tag: 'pds-popover',\n  styleUrl: 'pds-popover.scss',\n  shadow: true,\n})\nexport class PdsPopover {\n  /**\n   * Reference to the Host element\n   */\n  @Element() el: HTMLPdsPopoverElement;\n\n  /**\n   * Determines when the popover is active\n   * @defaultValue false\n   */\n  @State() active = false;\n\n  /**\n   * Determines the action that triggers the popover. For manual popovers, the consumer is responsible for toggling this value.\n   * @defaultValue \"show\"\n   */\n  @Prop() popoverTargetAction: 'show' | 'toggle' | 'hide' = 'show';\n\n  /**\n   * Determines the type of popover. Auto popovers can be \"light dismissed\" by clicking outside of the popover.\n   * Manual popovers require the consumer to handle the visibility of the popover.\n   */\n  @Prop() popoverType: 'auto' | 'manual' = 'auto';\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Text that appears on the trigger element\n   */\n  @Prop() text: string;\n\n  /**\n   * Sets the maximum width of the popover content\n   * @defaultValue 352\n   */\n  @Prop() maxWidth?: number = 352;\n\n  /**\n   * Determines the preferred position of the popover\n   * @defaultValue \"right\"\n   */\n  @Prop({ reflect: true }) placement: PlacementType = 'right';\n\n  componentWillRender() {\n    this.handlePopoverPositioning();\n  }\n\n  @Listen('click', {\n    capture: true\n  })\n  handleClick() {\n    this.active = !this.active;\n  }\n\n  @Listen('scroll', {\n    target: 'window',\n    capture: true\n  })\n  handleScroll() {\n    if (this.active) {\n      this.handlePopoverPositioning();\n    }\n  }\n\n  private handlePopoverPositioning() {\n    const triggerEl = this.el.shadowRoot.querySelector('.pds-popover__trigger') as HTMLElement;\n    const popoverEl = this.el.shadowRoot.querySelector('div[popover]') as HTMLElement;\n\n    if (!triggerEl || !popoverEl) return;\n\n    const triggerRect = triggerEl.getBoundingClientRect();\n    const popoverRect = popoverEl.getBoundingClientRect();\n\n    let top = 0;\n    let left = 0;\n    const offset = 8\n\n    switch (this.placement) {\n      case 'top':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;\n        break;\n      case 'top-start':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.left;\n        break;\n      case 'top-end':\n        top = triggerRect.top - popoverRect.height - offset;\n        left = triggerRect.right - popoverRect.width;\n        break;\n      case 'right':\n        top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;\n        left = triggerRect.right + offset;\n        break;\n      case 'right-start':\n        top = triggerRect.top;\n        left = triggerRect.right + offset;\n        break;\n      case 'right-end':\n        top = triggerRect.bottom - popoverRect.height;\n        left = triggerRect.right + offset;\n        break;\n      case 'bottom':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;\n        break;\n      case 'bottom-start':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.left;\n        break;\n      case 'bottom-end':\n        top = triggerRect.bottom + offset;\n        left = triggerRect.right - popoverRect.width;\n        break;\n      case 'left':\n        top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n      case 'left-start':\n        top = triggerRect.top;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n      case 'left-end':\n        top = triggerRect.bottom - popoverRect.height;\n        left = triggerRect.left - popoverRect.width - offset;\n        break;\n    }\n\n    popoverEl.style.top = `${top}px`;\n    popoverEl.style.left = `${left}px`;\n  }\n\n  render() {\n    return (\n      <Host>\n        <button\n          class=\"pds-popover__trigger\"\n          popoverTarget={this.componentId}\n          popoverTargetAction={this.popoverTargetAction}\n          onClick={this.handleClick}\n        >\n          {this.text}\n        </button>\n        <div\n          class={`pds-popover ${this.active ? 'pds-popover--active' : ''}`}\n          id={this.componentId}\n          popover={this.popoverType}\n          style={{ maxWidth: `${this.maxWidth}px` }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"0JAAA,IAAMA,EAAgB,8/B,ICQTC,EAAUC,EAAA,yBALvB,SAAAC,EAAAC,G,UAeWC,KAAMC,OAAG,MAMVD,KAAmBE,oBAA+B,OAMlDF,KAAWG,YAAsB,OAgBjCH,KAAQI,SAAY,IAMHJ,KAASK,UAAkB,OAiHrD,CA/GCP,EAAAQ,UAAAC,oBAAA,WACEP,KAAKQ,0B,EAMPV,EAAAQ,UAAAG,YAAA,WACET,KAAKC,QAAUD,KAAKC,M,EAOtBH,EAAAQ,UAAAI,aAAA,WACE,GAAIV,KAAKC,OAAQ,CACfD,KAAKQ,0B,GAIDV,EAAAQ,UAAAE,yBAAA,WACN,IAAMG,EAAYX,KAAKY,GAAGC,WAAWC,cAAc,yBACnD,IAAMC,EAAYf,KAAKY,GAAGC,WAAWC,cAAc,gBAEnD,IAAKH,IAAcI,EAAW,OAE9B,IAAMC,EAAcL,EAAUM,wBAC9B,IAAMC,EAAcH,EAAUE,wBAE9B,IAAIE,EAAM,EACV,IAAIC,EAAO,EACX,IAAMC,EAAS,EAEf,OAAQrB,KAAKK,WACX,IAAK,MACHc,EAAMH,EAAYG,IAAMD,EAAYI,OAASD,EAC7CD,EAAOJ,EAAYI,MAAQJ,EAAYO,MAAQL,EAAYK,OAAS,EACpE,MACF,IAAK,YACHJ,EAAMH,EAAYG,IAAMD,EAAYI,OAASD,EAC7CD,EAAOJ,EAAYI,KACnB,MACF,IAAK,UACHD,EAAMH,EAAYG,IAAMD,EAAYI,OAASD,EAC7CD,EAAOJ,EAAYQ,MAAQN,EAAYK,MACvC,MACF,IAAK,QACHJ,EAAMH,EAAYG,KAAOH,EAAYM,OAASJ,EAAYI,QAAU,EACpEF,EAAOJ,EAAYQ,MAAQH,EAC3B,MACF,IAAK,cACHF,EAAMH,EAAYG,IAClBC,EAAOJ,EAAYQ,MAAQH,EAC3B,MACF,IAAK,YACHF,EAAMH,EAAYS,OAASP,EAAYI,OACvCF,EAAOJ,EAAYQ,MAAQH,EAC3B,MACF,IAAK,SACHF,EAAMH,EAAYS,OAASJ,EAC3BD,EAAOJ,EAAYI,MAAQJ,EAAYO,MAAQL,EAAYK,OAAS,EACpE,MACF,IAAK,eACHJ,EAAMH,EAAYS,OAASJ,EAC3BD,EAAOJ,EAAYI,KACnB,MACF,IAAK,aACHD,EAAMH,EAAYS,OAASJ,EAC3BD,EAAOJ,EAAYQ,MAAQN,EAAYK,MACvC,MACF,IAAK,OACHJ,EAAMH,EAAYG,KAAOH,EAAYM,OAASJ,EAAYI,QAAU,EACpEF,EAAOJ,EAAYI,KAAOF,EAAYK,MAAQF,EAC9C,MACF,IAAK,aACHF,EAAMH,EAAYG,IAClBC,EAAOJ,EAAYI,KAAOF,EAAYK,MAAQF,EAC9C,MACF,IAAK,WACHF,EAAMH,EAAYS,OAASP,EAAYI,OACvCF,EAAOJ,EAAYI,KAAOF,EAAYK,MAAQF,EAC9C,MAGJN,EAAUW,MAAMP,IAAM,GAAAQ,OAAGR,EAAG,MAC5BJ,EAAUW,MAAMN,KAAO,GAAAO,OAAGP,EAAI,K,EAGhCtB,EAAAQ,UAAAsB,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EACE,UAAAE,IAAA,2CAAAC,MAAM,uBACNC,cAAejC,KAAKkC,YACpBhC,oBAAqBF,KAAKE,oBAC1BiC,QAASnC,KAAKS,aAEbT,KAAKoC,MAERP,EAAA,OAAAE,IAAA,2CACEC,MAAO,eAAAL,OAAe3B,KAAKC,OAAS,sBAAwB,IAC5DoC,GAAIrC,KAAKkC,YACTI,QAAStC,KAAKG,YACduB,MAAO,CAAEtB,SAAU,GAAAuB,OAAG3B,KAAKI,SAAQ,QAEnCyB,EAAa,QAAAE,IAAA,8C,uHAxJA,I","ignoreList":[]}

package/dist/pine-core/p-30e8c3ea.entry.js

@@ -1,2 +0,0 @@
-import{r as s,h as i,H as t,g as a}from"./p-Bf1dou5H.js";const e=":host{--tabs-dimension-panel-margin-top:var(--pine-dimension-none);--tabs-dimension-panel-padding:0;display:block}.pds-tabs__tablist{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-md)}:host(.pds-tabs--availability) .pds-tabs__tablist{gap:var(--pine-dimension-xs)}:host(.pds-tabs--filter) .pds-tabs__tablist{gap:var(--pine-dimension-sm)}:host(.pds-tabs--pill) .pds-tabs__tablist{background-color:var(--pine-color-grey-100);border:var(--pine-border-width-thin) solid var(--pine-color-grey-200);border-radius:var(--pine-dimension-100);display:-ms-inline-flexbox;display:inline-flex;display:-ms-flexbox;display:flex;gap:0;height:var(--pine-dimension-450)}";const n=class{constructor(i){s(this,i)}tabClickHandler(s){if(this.componentId===s.detail[1]){this.activeTabIndex=s.detail[0];this.activeTabName=this.tabs[this.activeTabIndex].name}}handleKeyDown(s){const i=["ArrowLeft","ArrowRight","Home","End"];if(i.includes(s.key)){s.preventDefault();this.moveActiveTab(s.key)}}moveActiveTab(s){const i=0;const t=this.tabs.length-1;let a=null;switch(s){case"ArrowLeft":a=this.activeTabIndex===i?t:this.activeTabIndex+-1;break;case"ArrowRight":a=this.activeTabIndex===t?i:this.activeTabIndex+1;break;case"Home":a=i;break;case"End":a=t;break}this.tabs[a].children[0].focus();this.activeTabName=this.tabs[a].name;this.activeTabIndex=a}findAllChildren(){this.tabs=this.el.querySelectorAll("pds-tab");this.tabPanels=this.el.querySelectorAll("pds-tabpanel")}propGeneration(s,i=0){s.parentComponentId=this.componentId.toString();s.variant=this.variant.toString();s.selected=this.activeTabName===s.name?true:false;s["index"]=i}passPropsToChildren(){this.tabs.forEach(((s,i)=>{if(this.activeTabName===s.name)this.activeTabIndex=i;this.propGeneration(s,i)}));this.tabPanels.forEach((s=>{this.propGeneration(s)}))}classNames(){let s=`pds-tabs`;if(this.variant&&this.variant!="primary"){const i=`pds-tabs--${this.variant}`;s+=" "+i}return s}componentWillLoad(){this.findAllChildren()}componentWillRender(){this.passPropsToChildren()}render(){return i(t,{key:"46ae07c28f9fb645e0e4a8165b5c3d2b0b9bdc4a","active-tab-name":this.activeTabName,class:this.classNames(),id:this.componentId},i("div",{key:"ab3ea42f6998356ea4a089e07bbe49c6f8e45d54",class:"pds-tabs__tablist",role:"tablist","aria-label":this.tablistLabel,part:"tab-list"},i("slot",{key:"e63be406b7d26ba2eff737d31fbc0d3bf959c99f",name:"tabs"})),i("slot",{key:"cacce277c237acfff91b879ea90ba134cf7e2b80",name:"tabpanels"}))}get el(){return a(this)}};n.style=e;export{n as pds_tabs};
-//# sourceMappingURL=p-30e8c3ea.entry.js.map

package/dist/pine-core/p-30e8c3ea.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsTabsCss","PdsTabs","tabClickHandler","event","this","componentId","detail","activeTabIndex","activeTabName","tabs","name","handleKeyDown","ev","keySet","includes","key","preventDefault","moveActiveTab","firstTabNumber","lastTabNumber","length","moveFocusTo","children","focus","findAllChildren","el","querySelectorAll","tabPanels","propGeneration","child","index","parentComponentId","toString","variant","selected","passPropsToChildren","forEach","classNames","className","variantClassName","componentWillLoad","componentWillRender","render","h","Host","class","id","role","tablistLabel","part"],"sources":["src/components/pds-tabs/pds-tabs.scss?tag=pds-tabs&encapsulation=shadow","src/components/pds-tabs/pds-tabs.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --tabs-dimension-panel-margin-top: Optional margin-top for panels\n   */\n  --tabs-dimension-panel-margin-top: var(--pine-dimension-none);\n  /**\n   * @prop --tabs-dimension-panel-padding: Optional padding for panels\n   */\n  --tabs-dimension-panel-padding: 0;\n\n  display: block;\n}\n\n.pds-tabs__tablist {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--pine-dimension-md);\n}\n\n:host(.pds-tabs--availability) .pds-tabs__tablist {\n  gap: var(--pine-dimension-xs);\n}\n\n:host(.pds-tabs--filter) .pds-tabs__tablist {\n  gap: var(--pine-dimension-sm);\n}\n\n:host(.pds-tabs--pill) .pds-tabs__tablist {\n  background-color: var(--pine-color-grey-100);\n  border: var(--pine-border-width-thin) solid var(--pine-color-grey-200);\n  border-radius: var(--pine-dimension-100);\n  display: inline-flex;\n  display: flex;\n  gap: 0;\n  height: var(--pine-dimension-450);\n}\n","import { Component, Element, Host, h, Prop, Listen } from '@stencil/core';\n\n  /**\n * @slot tabs - Content is placed within the `div[role=\"tablist\"]` element as children\n * @slot tabpanels - Content is placed directly after the `div[role=\"tablist\"]` element as siblings\n * @part tab-list - Exposes the container element that holds all the tab buttons for styling.\n */\n@Component({\n  tag: 'pds-tabs',\n  styleUrls: ['pds-tabs.scss'],\n  shadow: true,\n})\nexport class PdsTabs {\n  private tabs;\n  private tabPanels;\n\n  @Element() el: HTMLPdsTabsElement;\n\n  /**\n   * Sets the aria-label attached to the tablist element\n   */\n  @Prop() tablistLabel!: string;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Sets tabs variant styles as outlined in Figma documentation\n   */\n  @Prop() variant!: 'primary' | 'availability' | 'filter' | 'pill';\n\n  /**\n   * Sets the starting active tab name and maintains the name as the component re-renders\n   */\n  @Prop({mutable: true}) activeTabName!: string;\n\n  /**\n   * Sets the starting active tab index number and maintains the index number as the component re-renders\n   */\n  /** @internal */\n  @Prop({mutable: true}) activeTabIndex: number;\n\n  @Listen('pdsTabClick', {\n    target: 'body',\n  })\n  tabClickHandler(event: CustomEvent<any>) {\n    if (this.componentId === event.detail[1]) {\n      this.activeTabIndex = event.detail[0];\n      this.activeTabName = this.tabs[this.activeTabIndex].name;\n    }\n  }\n\n  @Listen('keydown', {})\n  handleKeyDown(ev: KeyboardEvent) {\n    const keySet = [\"ArrowLeft\", \"ArrowRight\", \"Home\", \"End\"];\n\n    if (keySet.includes(ev.key)) {\n      ev.preventDefault();\n      this.moveActiveTab(ev.key);\n    }\n  }\n\n  private moveActiveTab(key: string) {\n    const firstTabNumber = 0;\n    const lastTabNumber = this.tabs.length - 1;\n\n    let moveFocusTo = null;\n\n    switch (key) {\n      case 'ArrowLeft':\n        moveFocusTo = (this.activeTabIndex === firstTabNumber) ? lastTabNumber : (this.activeTabIndex + (-1));\n        break;\n      case 'ArrowRight':\n        moveFocusTo = (this.activeTabIndex === lastTabNumber) ? firstTabNumber : (this.activeTabIndex + 1);\n        break;\n      case 'Home':\n        moveFocusTo = firstTabNumber;\n        break;\n      case 'End':\n        moveFocusTo = lastTabNumber;\n        break;\n    }\n\n    // Move focus to the button element within `pds-tab`\n    this.tabs[moveFocusTo].children[0].focus();\n    this.activeTabName = this.tabs[moveFocusTo].name;\n    this.activeTabIndex = moveFocusTo;\n  }\n\n  private findAllChildren() {\n    this.tabs = this.el.querySelectorAll('pds-tab');\n    this.tabPanels = this.el.querySelectorAll('pds-tabpanel');\n  }\n\n  private propGeneration(child, index = 0) {\n    child.parentComponentId = this.componentId.toString();\n    child.variant = this.variant.toString();\n    child.selected = (this.activeTabName === child.name) ? true : false;\n    child['index'] = index;\n  }\n\n  private passPropsToChildren() {\n    this.tabs.forEach((child, index) => {\n      if (this.activeTabName === child.name) this.activeTabIndex = index;\n      this.propGeneration(child, index);\n    });\n\n    this.tabPanels.forEach((child) => {\n      this.propGeneration(child);\n    });\n  }\n\n  private classNames() {\n    let className = `pds-tabs`;\n    if (this.variant && this.variant != 'primary') {\n      const variantClassName = `pds-tabs--${this.variant}`;\n      className += ' ' + variantClassName;\n    }\n\n    return className;\n  };\n\n  componentWillLoad() {\n    this.findAllChildren();\n  }\n\n  componentWillRender() {\n    this.passPropsToChildren();\n  }\n\n  render() {\n    return (\n      <Host active-tab-name={this.activeTabName} class={this.classNames()} id={this.componentId}>\n        <div class=\"pds-tabs__tablist\" role=\"tablist\" aria-label={this.tablistLabel} part=\"tab-list\">\n          <slot name=\"tabs\" />\n        </div>\n        <slot name=\"tabpanels\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAa,2rB,MCYNC,EAAO,M,yBAmClB,eAAAC,CAAgBC,GACd,GAAIC,KAAKC,cAAgBF,EAAMG,OAAO,GAAI,CACxCF,KAAKG,eAAiBJ,EAAMG,OAAO,GACnCF,KAAKI,cAAgBJ,KAAKK,KAAKL,KAAKG,gBAAgBG,I,EAKxD,aAAAC,CAAcC,GACZ,MAAMC,EAAS,CAAC,YAAa,aAAc,OAAQ,OAEnD,GAAIA,EAAOC,SAASF,EAAGG,KAAM,CAC3BH,EAAGI,iBACHZ,KAAKa,cAAcL,EAAGG,I,EAIlB,aAAAE,CAAcF,GACpB,MAAMG,EAAiB,EACvB,MAAMC,EAAgBf,KAAKK,KAAKW,OAAS,EAEzC,IAAIC,EAAc,KAElB,OAAQN,GACN,IAAK,YACHM,EAAejB,KAAKG,iBAAmBW,EAAkBC,EAAiBf,KAAKG,gBAAkB,EACjG,MACF,IAAK,aACHc,EAAejB,KAAKG,iBAAmBY,EAAiBD,EAAkBd,KAAKG,eAAiB,EAChG,MACF,IAAK,OACHc,EAAcH,EACd,MACF,IAAK,MACHG,EAAcF,EACd,MAIJf,KAAKK,KAAKY,GAAaC,SAAS,GAAGC,QACnCnB,KAAKI,cAAgBJ,KAAKK,KAAKY,GAAaX,KAC5CN,KAAKG,eAAiBc,C,CAGhB,eAAAG,GACNpB,KAAKK,KAAOL,KAAKqB,GAAGC,iBAAiB,WACrCtB,KAAKuB,UAAYvB,KAAKqB,GAAGC,iBAAiB,e,CAGpC,cAAAE,CAAeC,EAAOC,EAAQ,GACpCD,EAAME,kBAAoB3B,KAAKC,YAAY2B,WAC3CH,EAAMI,QAAU7B,KAAK6B,QAAQD,WAC7BH,EAAMK,SAAY9B,KAAKI,gBAAkBqB,EAAMnB,KAAQ,KAAO,MAC9DmB,EAAM,SAAWC,C,CAGX,mBAAAK,GACN/B,KAAKK,KAAK2B,SAAQ,CAACP,EAAOC,KACxB,GAAI1B,KAAKI,gBAAkBqB,EAAMnB,KAAMN,KAAKG,eAAiBuB,EAC7D1B,KAAKwB,eAAeC,EAAOC,EAAM,IAGnC1B,KAAKuB,UAAUS,SAASP,IACtBzB,KAAKwB,eAAeC,EAAM,G,CAItB,UAAAQ,GACN,IAAIC,EAAY,WAChB,GAAIlC,KAAK6B,SAAW7B,KAAK6B,SAAW,UAAW,CAC7C,MAAMM,EAAmB,aAAanC,KAAK6B,UAC3CK,GAAa,IAAMC,C,CAGrB,OAAOD,C,CAGT,iBAAAE,GACEpC,KAAKoB,iB,CAGP,mBAAAiB,GACErC,KAAK+B,qB,CAGP,MAAAO,GACE,OACEC,EAACC,EAAI,CAAA7B,IAAA,6DAAkBX,KAAKI,cAAeqC,MAAOzC,KAAKiC,aAAcS,GAAI1C,KAAKC,aAC5EsC,EAAA,OAAA5B,IAAA,2CAAK8B,MAAM,oBAAoBE,KAAK,UAAsB,aAAA3C,KAAK4C,aAAcC,KAAK,YAChFN,EAAA,QAAA5B,IAAA,2CAAML,KAAK,UAEbiC,EAAA,QAAA5B,IAAA,2CAAML,KAAK,c","ignoreList":[]}

package/dist/pine-core/p-31f6fcc1.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,h as d,g as e}from"./p-Bf1dou5H.js";const i=".pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity 0.2s ease, visibility 0.2s ease;transition:opacity 0.2s ease, visibility 0.2s ease;visibility:hidden;width:100%;z-index:1000}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal .pds-modal__backdrop{z-index:1001}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop.open{opacity:1;visibility:visible}.pds-modal{background:var(--pine-color-background-container);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}";const a=class{constructor(d){t(this,d);this.pdsModalOpen=s(this,"pdsModalOpen");this.pdsModalClose=s(this,"pdsModalClose");this.focusableElements=[];this.backdropDismiss=true;this.open=false;this.size="md";this.scrollable=true;this.focusableElementsArray=[];this.handleBackdropClick=t=>{if(!this.backdropDismiss||!this.open)return;if(t.target.classList.contains("pds-modal__backdrop")){t.stopPropagation();if(this.isInnermostModal()){this.hideModal()}}};this.handleKeyDown=t=>{if(!this.open)return;if(t.key==="Escape"){if(this.isInnermostModal()){t.preventDefault();this.hideModal()}return}if(t.key==="Tab"){if(this.focusableElements.length===0)return;const s=this.focusableElements[0];const d=this.focusableElements[this.focusableElements.length-1];const e=document.activeElement;const i=e===s||s.contains(e);const a=e===d||d.contains(e);if(t.shiftKey&&i){t.preventDefault();this.focusElement(d)}else if(!t.shiftKey&&a){t.preventDefault();this.focusElement(s)}}}}componentDidLoad(){this.modalRef=this.el.querySelector(".pds-modal__backdrop");document.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){document.removeEventListener("keydown",this.handleKeyDown)}handleOpenChange(t){if(t){this.showModal()}else{this.hideModal()}}updateFocusableElements(){if(!this.modalRef)return;const t=["a[href]","button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])',"pds-button:not([disabled])","pds-link:not([disabled])","pds-input:not([disabled])","pds-checkbox:not([disabled])","pds-radio:not([disabled])","pds-switch:not([disabled])","pds-select:not([disabled])"].join(",");this.focusableElements=Array.from(this.modalRef.querySelectorAll(t));this.focusableElements=this.focusableElements.filter((t=>{const s=window.getComputedStyle(t);return s.display!=="none"&&s.visibility!=="hidden"}))}setInitialFocus(){if(this.focusableElements.length===0)return;const t=this.focusableElements[0];this.focusElement(t)}focusElement(t){if(!t)return;try{t.focus();setTimeout((()=>{if(document.activeElement!==t){if(t.shadowRoot){const s=t.shadowRoot.querySelector("button, [tabindex], input, a[href]");if(s){s.focus()}}}}),0)}catch(t){console.error("Error focusing element:",t)}}async showModal(){if(this.modalRef){try{this.previousActiveElement=document.activeElement;this.modalRef.showModal();this.open=true;setTimeout((()=>{this.updateFocusableElements();this.setInitialFocus();this.pdsModalOpen.emit()}),100)}catch(t){console.error("Failed to show modal:",t)}}}async hideModal(){if(this.modalRef){try{this.modalRef.close();this.open=false;if(this.previousActiveElement&&typeof this.previousActiveElement.focus==="function"){this.previousActiveElement.focus()}this.pdsModalClose.emit()}catch(t){console.error("Failed to hide modal:",t)}}}getBackdropZIndex(t){const s=t.querySelector(".pds-modal__backdrop");return s?parseInt(getComputedStyle(s).zIndex,10):-1}isInnermostModal(){const t=Array.from(document.querySelectorAll("pds-modal")).filter((t=>t.open));if(t.length===0)return false;const s=this.el.querySelector(".pds-modal__backdrop");if(!s)return false;const d=t.map((t=>this.getBackdropZIndex(t)));const e=Math.max(...d);const i=this.getBackdropZIndex(this.el);return i===e}render(){return d("dialog",{key:"ca1fe22c9f9aa26e74234e5195c007760cbbf818",class:{"pds-modal__backdrop":true,open:this.open},"aria-modal":"true","aria-labelledby":`${this.componentId}-heading`,onClick:this.handleBackdropClick},d("div",{key:"d0f297574d53dc1718277a58c2ade00a5451f96b",class:{"pds-modal":true,[`pds-modal--${this.size}`]:true,"pds-modal--scrollable":this.scrollable}},d("slot",{key:"37bb5abda88b4db9304884532951980ea8b9eaf8"})))}get el(){return e(this)}static get watchers(){return{open:["handleOpenChange"]}}};a.style=i;export{a as pds_modal};
-//# sourceMappingURL=p-31f6fcc1.entry.js.map

package/dist/pine-core/p-31f6fcc1.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pdsModalCss","PdsModal","constructor","hostRef","this","focusableElements","backdropDismiss","open","size","scrollable","focusableElementsArray","handleBackdropClick","e","target","classList","contains","stopPropagation","isInnermostModal","hideModal","handleKeyDown","key","preventDefault","length","firstFocusableElement","lastFocusableElement","activeElement","document","isFirstElement","isLastElement","shiftKey","focusElement","componentDidLoad","modalRef","el","querySelector","addEventListener","disconnectedCallback","removeEventListener","handleOpenChange","newValue","showModal","updateFocusableElements","selector","join","Array","from","querySelectorAll","filter","style","window","getComputedStyle","display","visibility","setInitialFocus","firstElement","element","focus","setTimeout","shadowRoot","focusableInShadow","error","console","previousActiveElement","pdsModalOpen","emit","close","pdsModalClose","getBackdropZIndex","modal","backdrop","parseInt","zIndex","openModals","thisBackdrop","modalZIndexes","map","maxZIndex","Math","max","thisZIndex","render","h","class","componentId","onClick"],"sources":["src/components/pds-modal/pds-modal.scss?tag=pds-modal","src/components/pds-modal/pds-modal.tsx"],"sourcesContent":[".pds-modal__backdrop {\n  align-items: flex-start;\n  background-color: rgba(0, 0, 0, 0.4);\n  border: 0;\n  display: flex;\n  height: 100%;\n  inset: 0;\n  justify-content: center;\n  margin: 0;\n  max-height: 100%;\n  max-width: 100%;\n  opacity: 0;\n  padding: 0;\n  position: fixed;\n  transition: opacity 0.2s ease, visibility 0.2s ease;\n  visibility: hidden;\n  width: 100%;\n  z-index: 1000;\n\n  @supports (backdrop-filter: blur(3px)) {\n    backdrop-filter: blur(3px);\n  }\n\n  // Increase z-index for nested modals\n  pds-modal & {\n    z-index: 1001;\n  }\n\n  &::backdrop {\n    background: transparent;\n  }\n\n  &.open {\n    opacity: 1;\n    visibility: visible;\n  }\n}\n\n.pds-modal {\n  background: var(--pine-color-background-container);\n  border-radius: var(--pine-dimension-sm);\n  box-shadow: var(--pine-box-shadow-400);\n  display: flex;\n  flex-direction: column;\n  margin: var(--pine-dimension-md);\n  max-height: none;\n  width: 100%;\n\n  &.pds-modal--scrollable {\n    max-height: calc(100vh - (calc(5vh + 96px)));\n\n    @supports (height: 100dvh) {\n      max-height: calc(100dvh - (calc(5dvh + 96px)));\n    }\n  }\n\n  @media (min-width: 992px) {\n    margin-block-start: 6vh;\n\n    @supports (height: 100dvh) {\n      margin-block-start: 6dvh;\n    }\n  }\n\n  @media (min-width: 1200px) {\n    margin-block-start: 8vh;\n\n    @supports (height: 100dvh) {\n      margin-block-start: 8dvh;\n    }\n  }\n}\n\n.pds-modal--sm {\n  max-width: 520px;\n}\n\n.pds-modal--md {\n  max-width: 700px;\n}\n\n.pds-modal--lg {\n  max-width: 900px;\n}\n\n.pds-modal--fullscreen {\n  border-radius: 0;\n  height: 100%;\n  margin: 0;\n  max-height: 100vh;\n  max-width: 100%;\n\n  @supports (height: 100dvh) {\n    max-height: 100dvh;\n  }\n\n  &.pds-modal--scrollable {\n    max-height: 100vh;\n\n    @supports (height: 100dvh) {\n      max-height: 100dvh;\n    }\n  }\n}\n\n.pds-modal-content {\n  .pds-modal--fullscreen & {\n    flex: 1;\n  }\n}\n\n// Scrollable modal styles (default behavior)\n.pds-modal--scrollable {\n  pds-modal-content {\n    border-block-end: 1px solid transparent;\n    border-block-start: 1px solid transparent;\n    overflow-y: auto;\n  }\n}\n\n// Non-scrollable modal styles\n.pds-modal:not(.pds-modal--scrollable) {\n  pds-modal-content {\n    overflow-y: visible;\n  }\n}\n\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n  tag: 'pds-modal',\n  styleUrl: 'pds-modal.scss',\n  shadow: false\n})\nexport class PdsModal {\n  private modalRef: HTMLDialogElement;\n  private previousActiveElement: HTMLElement;\n  private focusableElements: HTMLElement[] = [];\n\n  @Element() el: HTMLPdsModalElement;\n\n  /**\n   * Whether the modal can be dismissed by clicking the backdrop\n   * @default true\n   */\n  @Prop() backdropDismiss = true;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Whether the modal is open\n   * @default false\n   */\n  @Prop({ mutable: true }) open = false;\n\n  /**\n   * The size of the modal\n   * @default 'md'\n   */\n  @Prop() size: 'sm' | 'md' | 'lg' | 'fullscreen' = 'md';\n\n  /**\n   * Whether the modal content should be scrollable\n   * @default true\n   */\n  @Prop() scrollable = true;\n\n  /**\n   * Emitted when the modal is opened\n   */\n  @Event() pdsModalOpen: EventEmitter<void>;\n\n  /**\n   * Emitted when the modal is closed\n   */\n  @Event() pdsModalClose: EventEmitter<void>;\n\n  /**\n   * Stores the list of focusable elements in the modal\n   */\n  @State() focusableElementsArray: HTMLElement[] = [];\n\n  componentDidLoad() {\n    this.modalRef = this.el.querySelector('.pds-modal__backdrop') as HTMLDialogElement;\n    // Add keyboard event listener\n    document.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  disconnectedCallback() {\n    // Clean up event listener\n    document.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  @Watch('open')\n  handleOpenChange(newValue: boolean) {\n    if (newValue) {\n      this.showModal();\n    } else {\n      this.hideModal();\n    }\n  }\n\n  /**\n   * Updates the list of focusable elements in the modal\n   */\n  private updateFocusableElements() {\n    if (!this.modalRef) return;\n\n    // Get all focusable elements within the modal\n    const selector = [\n      'a[href]',\n      'button:not([disabled])',\n      'input:not([disabled])',\n      'select:not([disabled])',\n      'textarea:not([disabled])',\n      '[tabindex]:not([tabindex=\"-1\"])',\n      'pds-button:not([disabled])',\n      'pds-link:not([disabled])',\n      'pds-input:not([disabled])',\n      'pds-checkbox:not([disabled])',\n      'pds-radio:not([disabled])',\n      'pds-switch:not([disabled])',\n      'pds-select:not([disabled])',\n    ].join(',');\n\n    this.focusableElements = Array.from(\n      this.modalRef.querySelectorAll(selector)\n    ) as HTMLElement[];\n\n    // Filter out elements with display: none or visibility: hidden\n    this.focusableElements = this.focusableElements.filter(el => {\n      const style = window.getComputedStyle(el);\n      return style.display !== 'none' && style.visibility !== 'hidden';\n    });\n  }\n\n  /**\n   * Sets focus to the first focusable element in the modal\n   */\n  private setInitialFocus() {\n    if (this.focusableElements.length === 0) return;\n\n    // Focus the first focusable element\n    const firstElement = this.focusableElements[0];\n\n    // For web components, we need to ensure they're properly focused\n    this.focusElement(firstElement);\n  }\n\n  /**\n   * Helper method to focus an element, with special handling for web components\n   */\n  private focusElement(element: HTMLElement) {\n    if (!element) return;\n\n    try {\n      // Try standard focus first\n      element.focus();\n\n      // Check if focus worked\n      setTimeout(() => {\n        if (document.activeElement !== element) {\n          // For web components, try to find a focusable element inside\n          if (element.shadowRoot) {\n            const focusableInShadow = element.shadowRoot.querySelector(\n              'button, [tabindex], input, a[href]'\n            ) as HTMLElement;\n\n            if (focusableInShadow) {\n              focusableInShadow.focus();\n            }\n          }\n        }\n      }, 0);\n    } catch (error) {\n      console.error('Error focusing element:', error);\n    }\n  }\n\n  /**\n   * Opens the modal\n   */\n  @Method()\n  async showModal() {\n    if (this.modalRef) {\n      try {\n        // Store the currently focused element to restore focus when modal closes\n        this.previousActiveElement = document.activeElement as HTMLElement;\n\n        // Use native dialog showModal method which makes the rest of the page inert\n        this.modalRef.showModal();\n        this.open = true;\n\n        // Update focusable elements and set initial focus\n        // Using a longer timeout to ensure all components are fully rendered\n        setTimeout(() => {\n          this.updateFocusableElements();\n          this.setInitialFocus();\n          this.pdsModalOpen.emit();\n        }, 100);\n      } catch (error) {\n        console.error('Failed to show modal:', error);\n      }\n    }\n  }\n\n  /**\n   * Closes the modal\n   */\n  @Method()\n  async hideModal() {\n    if (this.modalRef) {\n      try {\n        this.modalRef.close();\n        this.open = false;\n\n        // Restore focus to the element that was focused before the modal was opened\n        if (this.previousActiveElement && typeof this.previousActiveElement.focus === 'function') {\n          this.previousActiveElement.focus();\n        }\n\n        this.pdsModalClose.emit();\n      } catch (error) {\n        console.error('Failed to hide modal:', error);\n      }\n    }\n  }\n\n  private handleBackdropClick = (e: MouseEvent) => {\n    if (!this.backdropDismiss || !this.open) return;\n\n    if ((e.target as HTMLElement).classList.contains('pds-modal__backdrop')) {\n      e.stopPropagation();\n\n      // Only close if this is the innermost modal\n      if (this.isInnermostModal()) {\n        this.hideModal();\n      }\n    }\n  };\n\n  /**\n   * Gets the z-index of a modal's backdrop element\n   */\n  private getBackdropZIndex(modal: Element): number {\n    const backdrop = modal.querySelector('.pds-modal__backdrop');\n    return backdrop ? parseInt(getComputedStyle(backdrop).zIndex, 10) : -1;\n  }\n\n  /**\n   * Checks if this modal is the innermost (highest z-index) modal\n   */\n  private isInnermostModal(): boolean {\n    // Find all open modals\n    const openModals = Array.from(document.querySelectorAll('pds-modal')).filter(\n      modal => modal.open\n    );\n\n    if (openModals.length === 0) return false;\n\n    // Get this modal's backdrop element\n    const thisBackdrop = this.el.querySelector('.pds-modal__backdrop');\n    if (!thisBackdrop) return false;\n\n    // Get computed z-index of all open modal backdrops\n    const modalZIndexes = openModals.map(modal => this.getBackdropZIndex(modal));\n\n    // Get the highest z-index\n    const maxZIndex = Math.max(...modalZIndexes);\n\n    // Check if this modal's backdrop has the highest z-index\n    const thisZIndex = this.getBackdropZIndex(this.el);\n    return thisZIndex === maxZIndex;\n  }\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    // If the modal is not open, don't handle any keyboard events\n    if (!this.open) return;\n\n    // Handle Escape key to close the modal\n    if (e.key === 'Escape') {\n      // Only close if this is the innermost modal\n      if (this.isInnermostModal()) {\n        e.preventDefault();\n        this.hideModal();\n      }\n      return;\n    }\n\n    // Handle Tab key for focus trapping\n    if (e.key === 'Tab') {\n      // If there are no focusable elements, do nothing\n      if (this.focusableElements.length === 0) return;\n\n      // Get the first and last focusable elements\n      const firstFocusableElement = this.focusableElements[0];\n      const lastFocusableElement = this.focusableElements[this.focusableElements.length - 1];\n\n      // Get the current active element\n      const activeElement = document.activeElement;\n\n      // Check if we need to wrap focus\n      const isFirstElement = activeElement === firstFocusableElement ||\n                            firstFocusableElement.contains(activeElement as Node);\n\n      const isLastElement = activeElement === lastFocusableElement ||\n                           lastFocusableElement.contains(activeElement as Node);\n\n      // If shift + tab is pressed and focus is on the first element, move to the last element\n      if (e.shiftKey && isFirstElement) {\n        e.preventDefault();\n        this.focusElement(lastFocusableElement);\n      }\n      // If tab is pressed and focus is on the last element, move to the first element\n      else if (!e.shiftKey && isLastElement) {\n        e.preventDefault();\n        this.focusElement(firstFocusableElement);\n      }\n    }\n  };\n\n  render() {\n    return (\n      <dialog\n        class={{\n          'pds-modal__backdrop': true,\n          'open': this.open\n        }}\n        aria-modal=\"true\"\n        aria-labelledby={`${this.componentId}-heading`}\n        onClick={this.handleBackdropClick}\n      >\n        <div\n          class={{\n            'pds-modal': true,\n            [`pds-modal--${this.size}`]: true,\n            'pds-modal--scrollable': this.scrollable\n          }}\n        >\n          <slot></slot>\n        </div>\n      </dialog>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}