@pine-ds/core 3.5.0 → 3.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (118) hide show
  1. package/components/pds-table-body.js +1 -1
  2. package/components/pds-table-body.js.map +1 -1
  3. package/components/pds-table-cell2.js +2 -2
  4. package/components/pds-table-cell2.js.map +1 -1
  5. package/components/pds-table-head-cell2.js +2 -2
  6. package/components/pds-table-head-cell2.js.map +1 -1
  7. package/components/pds-table-head.js +1 -1
  8. package/components/pds-table-head.js.map +1 -1
  9. package/components/pds-table-row.js +1 -1
  10. package/components/pds-table-row.js.map +1 -1
  11. package/components/pds-table.js +2 -2
  12. package/components/pds-table.js.map +1 -1
  13. package/dist/cjs/pds-table-body.cjs.entry.js +1 -1
  14. package/dist/cjs/pds-table-body.cjs.entry.js.map +1 -1
  15. package/dist/cjs/pds-table-body.entry.cjs.js.map +1 -1
  16. package/dist/cjs/pds-table-cell.cjs.entry.js +2 -2
  17. package/dist/cjs/pds-table-cell.cjs.entry.js.map +1 -1
  18. package/dist/cjs/pds-table-cell.entry.cjs.js.map +1 -1
  19. package/dist/cjs/pds-table-head-cell.cjs.entry.js +2 -2
  20. package/dist/cjs/pds-table-head-cell.cjs.entry.js.map +1 -1
  21. package/dist/cjs/pds-table-head-cell.entry.cjs.js.map +1 -1
  22. package/dist/cjs/pds-table-head.cjs.entry.js +1 -1
  23. package/dist/cjs/pds-table-head.cjs.entry.js.map +1 -1
  24. package/dist/cjs/pds-table-head.entry.cjs.js.map +1 -1
  25. package/dist/cjs/pds-table-row.cjs.entry.js +1 -1
  26. package/dist/cjs/pds-table-row.cjs.entry.js.map +1 -1
  27. package/dist/cjs/pds-table-row.entry.cjs.js.map +1 -1
  28. package/dist/cjs/pds-table.cjs.entry.js +2 -2
  29. package/dist/cjs/pds-table.cjs.entry.js.map +1 -1
  30. package/dist/cjs/pds-table.entry.cjs.js.map +1 -1
  31. package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js +1 -1
  32. package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js.map +1 -1
  33. package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js +2 -2
  34. package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js.map +1 -1
  35. package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js +1 -1
  36. package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js.map +1 -1
  37. package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +2 -2
  38. package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js.map +1 -1
  39. package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js +1 -1
  40. package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js.map +1 -1
  41. package/dist/collection/components/pds-table/pds-table.js +2 -2
  42. package/dist/collection/components/pds-table/pds-table.js.map +1 -1
  43. package/dist/docs.json +73 -7
  44. package/dist/esm/pds-table-body.entry.js +1 -1
  45. package/dist/esm/pds-table-body.entry.js.map +1 -1
  46. package/dist/esm/pds-table-cell.entry.js +2 -2
  47. package/dist/esm/pds-table-cell.entry.js.map +1 -1
  48. package/dist/esm/pds-table-head-cell.entry.js +2 -2
  49. package/dist/esm/pds-table-head-cell.entry.js.map +1 -1
  50. package/dist/esm/pds-table-head.entry.js +1 -1
  51. package/dist/esm/pds-table-head.entry.js.map +1 -1
  52. package/dist/esm/pds-table-row.entry.js +1 -1
  53. package/dist/esm/pds-table-row.entry.js.map +1 -1
  54. package/dist/esm/pds-table.entry.js +2 -2
  55. package/dist/esm/pds-table.entry.js.map +1 -1
  56. package/dist/esm-es5/pds-table-body.entry.js +1 -1
  57. package/dist/esm-es5/pds-table-body.entry.js.map +1 -1
  58. package/dist/esm-es5/pds-table-cell.entry.js +1 -1
  59. package/dist/esm-es5/pds-table-cell.entry.js.map +1 -1
  60. package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
  61. package/dist/esm-es5/pds-table-head-cell.entry.js.map +1 -1
  62. package/dist/esm-es5/pds-table-head.entry.js +1 -1
  63. package/dist/esm-es5/pds-table-head.entry.js.map +1 -1
  64. package/dist/esm-es5/pds-table-row.entry.js +1 -1
  65. package/dist/esm-es5/pds-table-row.entry.js.map +1 -1
  66. package/dist/esm-es5/pds-table.entry.js +1 -1
  67. package/dist/esm-es5/pds-table.entry.js.map +1 -1
  68. package/dist/pine-core/{p-Dx9XkHH8.system.js.map → p-0TIvNV5c.system.js.map} +1 -1
  69. package/dist/pine-core/{p-28f7c0d8.system.entry.js → p-0de9f8da.system.entry.js} +2 -2
  70. package/dist/pine-core/{p-28f7c0d8.system.entry.js.map → p-0de9f8da.system.entry.js.map} +1 -1
  71. package/dist/pine-core/{p-fc457c65.entry.js → p-44087d1c.entry.js} +2 -2
  72. package/dist/pine-core/{p-fc457c65.entry.js.map → p-44087d1c.entry.js.map} +1 -1
  73. package/dist/pine-core/{p-ab82338f.entry.js → p-464dd476.entry.js} +2 -2
  74. package/dist/pine-core/{p-ab82338f.entry.js.map → p-464dd476.entry.js.map} +1 -1
  75. package/dist/pine-core/{p-2e491c3d.entry.js → p-50c9e865.entry.js} +2 -2
  76. package/dist/pine-core/p-50c9e865.entry.js.map +1 -0
  77. package/dist/pine-core/p-7004d1ea.system.entry.js +2 -0
  78. package/dist/pine-core/p-7004d1ea.system.entry.js.map +1 -0
  79. package/dist/pine-core/{p-a472af99.system.entry.js → p-73158adf.system.entry.js} +2 -2
  80. package/dist/pine-core/{p-a472af99.system.entry.js.map → p-73158adf.system.entry.js.map} +1 -1
  81. package/dist/pine-core/{p-db1956e5.entry.js → p-7cb4f0de.entry.js} +2 -2
  82. package/dist/pine-core/p-7cb4f0de.entry.js.map +1 -0
  83. package/dist/pine-core/{p-3ccb6b0c.system.entry.js → p-8999b63d.system.entry.js} +2 -2
  84. package/dist/pine-core/p-8999b63d.system.entry.js.map +1 -0
  85. package/dist/pine-core/{p-DBw5MRwj.system.js.map → p-BRygGju8.system.js.map} +1 -1
  86. package/dist/pine-core/{p-DZggSEPe.system.js.map → p-CE6b_LzB.system.js.map} +1 -1
  87. package/dist/pine-core/{p-B6Znd6C5.system.js.map → p-CpdNWpfd.system.js.map} +1 -1
  88. package/dist/pine-core/{p-CYiuzbNk.system.js.map → p-DHmJZxQk.system.js.map} +1 -1
  89. package/dist/pine-core/p-De9tROL-.system.js +1 -1
  90. package/dist/pine-core/{p-rBOkvo-C.system.js.map → p-IhWWc2L_.system.js.map} +1 -1
  91. package/dist/pine-core/{p-174506b9.entry.js → p-ac37cf0d.entry.js} +2 -2
  92. package/dist/pine-core/p-ac37cf0d.entry.js.map +1 -0
  93. package/dist/pine-core/p-be939cb0.entry.js +2 -0
  94. package/dist/pine-core/p-be939cb0.entry.js.map +1 -0
  95. package/dist/pine-core/{p-3abc0f49.system.entry.js → p-da367b5e.system.entry.js} +2 -2
  96. package/dist/pine-core/p-da367b5e.system.entry.js.map +1 -0
  97. package/dist/pine-core/{p-7d2c43df.system.entry.js → p-fd091234.system.entry.js} +2 -2
  98. package/dist/pine-core/p-fd091234.system.entry.js.map +1 -0
  99. package/dist/pine-core/pds-table-body.entry.esm.js.map +1 -1
  100. package/dist/pine-core/pds-table-cell.entry.esm.js.map +1 -1
  101. package/dist/pine-core/pds-table-head-cell.entry.esm.js.map +1 -1
  102. package/dist/pine-core/pds-table-head.entry.esm.js.map +1 -1
  103. package/dist/pine-core/pds-table-row.entry.esm.js.map +1 -1
  104. package/dist/pine-core/pds-table.entry.esm.js.map +1 -1
  105. package/dist/pine-core/pine-core.esm.js +1 -1
  106. package/hydrate/index.js +9 -9
  107. package/hydrate/index.mjs +9 -9
  108. package/package.json +2 -2
  109. package/dist/pine-core/p-174506b9.entry.js.map +0 -1
  110. package/dist/pine-core/p-2e491c3d.entry.js.map +0 -1
  111. package/dist/pine-core/p-3abc0f49.system.entry.js.map +0 -1
  112. package/dist/pine-core/p-3ccb6b0c.system.entry.js.map +0 -1
  113. package/dist/pine-core/p-487859a1.system.entry.js +0 -2
  114. package/dist/pine-core/p-487859a1.system.entry.js.map +0 -1
  115. package/dist/pine-core/p-5c0803c3.entry.js +0 -2
  116. package/dist/pine-core/p-5c0803c3.entry.js.map +0 -1
  117. package/dist/pine-core/p-7d2c43df.system.entry.js.map +0 -1
  118. package/dist/pine-core/p-db1956e5.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"pds-table-head-cell.entry.cjs.js","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 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} />\n )}\n </Host>\n );\n }\n}\n"],"names":["h","Host","upSmall","downSmall"],"mappings":"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"}
1
+ {"version":3,"file":"pds-table-head-cell.entry.cjs.js","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"],"names":["h","Host","upSmall","downSmall"],"mappings":"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"}
@@ -39,7 +39,7 @@ const PdsTableHead = class {
39
39
  }
40
40
  }
41
41
  render() {
42
- return (index.h(index.Host, { key: 'ffa2760e5512a41cc8882722ea7ad7e5650de50f', role: "row" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-head-cell", { key: 'ba2e2ef60d570d739f5e582c0affe481ebed578d', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, index.h("pds-checkbox", { key: '4db057d54fbda8dccc49451ffb23ea1133fea53f', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected }))), index.h("slot", { key: '1f9167ccf1186c92033fa95b7e4a121b98d7c0ea' })));
42
+ return (index.h(index.Host, { key: 'dda71d591ccce76bdb055820c1c97358e545b522', role: "row", part: "head" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-head-cell", { key: '79bf1bd06b8e1ef05c9354c178787b4cff139e07', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, index.h("pds-checkbox", { key: '1ce038a3f3b9e038441fdf4b1d1fe4689f575604', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected, part: "select-all-checkbox" }))), index.h("slot", { key: 'f81d3922f892faa65abee99fd5af0d3232a25e9a' })));
43
43
  }
44
44
  get hostElement() { return index.getElement(this); }
45
45
  };
@@ -1 +1 @@
1
- {"file":"pds-table-head.entry.cjs.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,ogBAAogB;;MCQ/gB,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAyBU,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;AAC9B,YAAA,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;AAC/D,YAAA,MAAM,SAAS,GAAG,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC;AAChE,YAAA,MAAM,QAAQ,GAAG,CAAA,EAAG,YAAY,CAAI,CAAA,EAAA,SAAS,EAAE;AAE/C,YAAA,OAAO,QAAQ;AACjB,SAAC;AAEO,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,EAAS,KAAI;YAClC,IAAI,CAAC,UAAU,GAAG,CAAE,EAAE,CAAC,MAA2B,CAAC,OAAO;AAC1D,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;AACpC,SAAC;AAEO,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,UAAmB,KAAI;AAC7C,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;YAE1B,IAAKA,eAAO,CAAC,gBAAgB,EAAE,IAAI,CAAC,WAAW,CAAC,EAAG;gBACjD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;;AAE/C,SAAC;AAoCF;IAlCC,iBAAiB,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;;;IAItC,mBAAmB,GAAA;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB;QAE5E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC9C,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,iCAAiC,CAAC;YACnF,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC;;;IAIxC,MAAM,GAAA;QACJ,QACEC,OAAC,CAAAC,UAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,KAAK,EAAA,EACb,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,KACxCD,OAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,UAAU,GAAG,eAAe,GAAG,EAAE,EAAA,EACxEA,OAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,EACpC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,UAAU,EAAA,CACxB,CACkB,CACvB,EACDA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;","names":["closest","h","Host"],"sources":["src/components/pds-table/pds-table-head/pds-table-head.scss?tag=pds-table-head&encapsulation=shadow","src/components/pds-table/pds-table-head/pds-table-head.tsx"],"sourcesContent":[":host {\n --border-head-default: var(--pine-border-width-thin) solid var(--pine-color-grey-100);\n\n border-color: inherit;\n box-sizing: border-box;\n display: table-header-group;\n vertical-align: middle;\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 pds-table-checkbox-cell {\n border-block-end: var(--border-head-default);\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { closest } from '@utils/closest';\n\n@Component({\n tag: 'pds-table-head',\n styleUrls: ['pds-table-head.scss'],\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n private tableRef: HTMLPdsTableElement\n\n /**\n * Determines if the select all checkbox is in an indeterminate state.\n */\n @Prop({ mutable: true }) indeterminate?: boolean;\n\n /**\n * Determines if the table row is currently selected.\n * @defaultValue false\n */\n @Prop({mutable: true}) 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 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 private handleInput = (ev: Event) => {\n this.isSelected = !(ev.target as HTMLInputElement).checked\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 this.pdsTableSelectAll.emit({ isSelected });\n }\n }\n\n componentWillLoad() {\n if (this.isSelected) {\n this.handleSelect(this.isSelected)\n }\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-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n\n render() {\n return (\n <Host role=\"row\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.selectable ? 'checkbox-cell' : ''}>\n <pds-checkbox\n componentId={this.generateUniqueId()}\n indeterminate={this.indeterminate}\n onInput={this.handleInput}\n label={\"Select All Rows\"}\n hideLabel={true}\n checked={this.isSelected}\n />\n </pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pds-table-head.entry.cjs.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,ogBAAogB;;MCQ/gB,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAyBU,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;AAC9B,YAAA,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;AAC/D,YAAA,MAAM,SAAS,GAAG,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC;AAChE,YAAA,MAAM,QAAQ,GAAG,CAAA,EAAG,YAAY,CAAI,CAAA,EAAA,SAAS,EAAE;AAE/C,YAAA,OAAO,QAAQ;AACjB,SAAC;AAEO,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,EAAS,KAAI;YAClC,IAAI,CAAC,UAAU,GAAG,CAAE,EAAE,CAAC,MAA2B,CAAC,OAAO;AAC1D,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;AACpC,SAAC;AAEO,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,UAAmB,KAAI;AAC7C,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;YAE1B,IAAKA,eAAO,CAAC,gBAAgB,EAAE,IAAI,CAAC,WAAW,CAAC,EAAG;gBACjD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;;AAE/C,SAAC;AAqCF;IAnCC,iBAAiB,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;;;IAItC,mBAAmB,GAAA;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB;QAE5E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC9C,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,iCAAiC,CAAC;YACnF,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC;;;IAIxC,MAAM,GAAA;QACJ,QACEC,OAAC,CAAAC,UAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAA,EACzB,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,KACxCD,OAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,UAAU,GAAG,eAAe,GAAG,EAAE,EAAA,EACxEA,OAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,EACpC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,IAAI,EAAC,qBAAqB,EAAA,CAC1B,CACkB,CACvB,EACDA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;","names":["closest","h","Host"],"sources":["src/components/pds-table/pds-table-head/pds-table-head.scss?tag=pds-table-head&encapsulation=shadow","src/components/pds-table/pds-table-head/pds-table-head.tsx"],"sourcesContent":[":host {\n --border-head-default: var(--pine-border-width-thin) solid var(--pine-color-grey-100);\n\n border-color: inherit;\n box-sizing: border-box;\n display: table-header-group;\n vertical-align: middle;\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 pds-table-checkbox-cell {\n border-block-end: var(--border-head-default);\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { closest } from '@utils/closest';\n\n@Component({\n tag: 'pds-table-head',\n styleUrls: ['pds-table-head.scss'],\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n private tableRef: HTMLPdsTableElement\n\n /**\n * Determines if the select all checkbox is in an indeterminate state.\n */\n @Prop({ mutable: true }) indeterminate?: boolean;\n\n /**\n * Determines if the table row is currently selected.\n * @defaultValue false\n */\n @Prop({mutable: true}) 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 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 private handleInput = (ev: Event) => {\n this.isSelected = !(ev.target as HTMLInputElement).checked\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 this.pdsTableSelectAll.emit({ isSelected });\n }\n }\n\n componentWillLoad() {\n if (this.isSelected) {\n this.handleSelect(this.isSelected)\n }\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-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n\n render() {\n return (\n <Host role=\"row\" part=\"head\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.selectable ? 'checkbox-cell' : ''}>\n <pds-checkbox\n componentId={this.generateUniqueId()}\n indeterminate={this.indeterminate}\n onInput={this.handleInput}\n label={\"Select All Rows\"}\n hideLabel={true}\n checked={this.isSelected}\n part=\"select-all-checkbox\"\n />\n </pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -1 +1 @@
1
- {"version":3,"file":"pds-table-head.entry.cjs.js","sources":["src/components/pds-table/pds-table-head/pds-table-head.scss?tag=pds-table-head&encapsulation=shadow","src/components/pds-table/pds-table-head/pds-table-head.tsx"],"sourcesContent":[":host {\n --border-head-default: var(--pine-border-width-thin) solid var(--pine-color-grey-100);\n\n border-color: inherit;\n box-sizing: border-box;\n display: table-header-group;\n vertical-align: middle;\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 pds-table-checkbox-cell {\n border-block-end: var(--border-head-default);\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { closest } from '@utils/closest';\n\n@Component({\n tag: 'pds-table-head',\n styleUrls: ['pds-table-head.scss'],\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n private tableRef: HTMLPdsTableElement\n\n /**\n * Determines if the select all checkbox is in an indeterminate state.\n */\n @Prop({ mutable: true }) indeterminate?: boolean;\n\n /**\n * Determines if the table row is currently selected.\n * @defaultValue false\n */\n @Prop({mutable: true}) 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 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 private handleInput = (ev: Event) => {\n this.isSelected = !(ev.target as HTMLInputElement).checked\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 this.pdsTableSelectAll.emit({ isSelected });\n }\n }\n\n componentWillLoad() {\n if (this.isSelected) {\n this.handleSelect(this.isSelected)\n }\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-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n\n render() {\n return (\n <Host role=\"row\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.selectable ? 'checkbox-cell' : ''}>\n <pds-checkbox\n componentId={this.generateUniqueId()}\n indeterminate={this.indeterminate}\n onInput={this.handleInput}\n label={\"Select All Rows\"}\n hideLabel={true}\n checked={this.isSelected}\n />\n </pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"names":["closest","h","Host"],"mappings":";;;;;AAAA,MAAM,eAAe,GAAG,ogBAAogB;;MCQ/gB,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAyBU,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;AAC9B,YAAA,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;AAC/D,YAAA,MAAM,SAAS,GAAG,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC;AAChE,YAAA,MAAM,QAAQ,GAAG,CAAA,EAAG,YAAY,CAAI,CAAA,EAAA,SAAS,EAAE;AAE/C,YAAA,OAAO,QAAQ;AACjB,SAAC;AAEO,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,EAAS,KAAI;YAClC,IAAI,CAAC,UAAU,GAAG,CAAE,EAAE,CAAC,MAA2B,CAAC,OAAO;AAC1D,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;AACpC,SAAC;AAEO,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,UAAmB,KAAI;AAC7C,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;YAE1B,IAAKA,eAAO,CAAC,gBAAgB,EAAE,IAAI,CAAC,WAAW,CAAC,EAAG;gBACjD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;;AAE/C,SAAC;AAoCF;IAlCC,iBAAiB,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;;;IAItC,mBAAmB,GAAA;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB;QAE5E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC9C,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,iCAAiC,CAAC;YACnF,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC;;;IAIxC,MAAM,GAAA;QACJ,QACEC,OAAC,CAAAC,UAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,KAAK,EAAA,EACb,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,KACxCD,OAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,UAAU,GAAG,eAAe,GAAG,EAAE,EAAA,EACxEA,OAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,EACpC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,UAAU,EAAA,CACxB,CACkB,CACvB,EACDA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;"}
1
+ {"version":3,"file":"pds-table-head.entry.cjs.js","sources":["src/components/pds-table/pds-table-head/pds-table-head.scss?tag=pds-table-head&encapsulation=shadow","src/components/pds-table/pds-table-head/pds-table-head.tsx"],"sourcesContent":[":host {\n --border-head-default: var(--pine-border-width-thin) solid var(--pine-color-grey-100);\n\n border-color: inherit;\n box-sizing: border-box;\n display: table-header-group;\n vertical-align: middle;\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 pds-table-checkbox-cell {\n border-block-end: var(--border-head-default);\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { closest } from '@utils/closest';\n\n@Component({\n tag: 'pds-table-head',\n styleUrls: ['pds-table-head.scss'],\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n private tableRef: HTMLPdsTableElement\n\n /**\n * Determines if the select all checkbox is in an indeterminate state.\n */\n @Prop({ mutable: true }) indeterminate?: boolean;\n\n /**\n * Determines if the table row is currently selected.\n * @defaultValue false\n */\n @Prop({mutable: true}) 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 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 private handleInput = (ev: Event) => {\n this.isSelected = !(ev.target as HTMLInputElement).checked\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 this.pdsTableSelectAll.emit({ isSelected });\n }\n }\n\n componentWillLoad() {\n if (this.isSelected) {\n this.handleSelect(this.isSelected)\n }\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-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n\n render() {\n return (\n <Host role=\"row\" part=\"head\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.selectable ? 'checkbox-cell' : ''}>\n <pds-checkbox\n componentId={this.generateUniqueId()}\n indeterminate={this.indeterminate}\n onInput={this.handleInput}\n label={\"Select All Rows\"}\n hideLabel={true}\n checked={this.isSelected}\n part=\"select-all-checkbox\"\n />\n </pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"names":["closest","h","Host"],"mappings":";;;;;AAAA,MAAM,eAAe,GAAG,ogBAAogB;;MCQ/gB,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAyBU,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;AAC9B,YAAA,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;AAC/D,YAAA,MAAM,SAAS,GAAG,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC;AAChE,YAAA,MAAM,QAAQ,GAAG,CAAA,EAAG,YAAY,CAAI,CAAA,EAAA,SAAS,EAAE;AAE/C,YAAA,OAAO,QAAQ;AACjB,SAAC;AAEO,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,EAAS,KAAI;YAClC,IAAI,CAAC,UAAU,GAAG,CAAE,EAAE,CAAC,MAA2B,CAAC,OAAO;AAC1D,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;AACpC,SAAC;AAEO,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,UAAmB,KAAI;AAC7C,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;YAE1B,IAAKA,eAAO,CAAC,gBAAgB,EAAE,IAAI,CAAC,WAAW,CAAC,EAAG;gBACjD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;;AAE/C,SAAC;AAqCF;IAnCC,iBAAiB,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC;;;IAItC,mBAAmB,GAAA;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB;QAE5E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC9C,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,iCAAiC,CAAC;YACnF,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC;;;IAIxC,MAAM,GAAA;QACJ,QACEC,OAAC,CAAAC,UAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAA,EACzB,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,KACxCD,OAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,UAAU,GAAG,eAAe,GAAG,EAAE,EAAA,EACxEA,OAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,EACpC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,IAAI,EAAC,qBAAqB,EAAA,CAC1B,CACkB,CACvB,EACDA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;"}
@@ -50,7 +50,7 @@ const PdsTableRow = class {
50
50
  }
51
51
  }
52
52
  render() {
53
- return (index.h(index.Host, { key: '05fb5cf3a7bc10dbe451f6df0e338efe74f9d40e', class: this.classNames(), role: "row" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-cell", { key: '13f61eb4c6503a488e5307de41718bd1c03a2613', part: this.tableRef.fixedColumn ? 'checkbox-cell' : '', class: this.tableRef.selectable ? 'has-checkbox' : '' }, index.h("pds-checkbox", { key: 'f17a2377913a8a6285e1eaee76700246c7861e9f', componentId: this.generateUniqueId(), onClick: this.handleClick, indeterminate: this.indeterminate, label: "Select Row", hideLabel: true, checked: this.isSelected }))), index.h("slot", { key: 'c84de0c7125f6892bc88aae69b367994f48281b1' })));
53
+ return (index.h(index.Host, { key: '45de7019e5fe44cd27a02450205cf96429072db3', class: this.classNames(), role: "row", part: "row" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-cell", { key: '770cf9bcfff13b8de986d42f6ad6c249b4259191', part: this.tableRef.fixedColumn ? 'checkbox-cell' : 'checkbox-cell', class: this.tableRef.selectable ? 'has-checkbox' : '' }, index.h("pds-checkbox", { key: '5a1e28f23dda779862a310d83308396e14a839d6', componentId: this.generateUniqueId(), onClick: this.handleClick, indeterminate: this.indeterminate, label: "Select Row", hideLabel: true, checked: this.isSelected, part: "row-checkbox" }))), index.h("slot", { key: '7dd5716693ad855d1f072f0af9013ca4383bab5e' })));
54
54
  }
55
55
  get hostElement() { return index.getElement(this); }
56
56
  };
@@ -1 +1 @@
1
- {"file":"pds-table-row.entry.cjs.js","mappings":"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","names":["closest","h","Host"],"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 >\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-cell part={this.tableRef.fixedColumn ? '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 />\n </pds-table-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pds-table-row.entry.cjs.js","mappings":"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","names":["closest","h","Host"],"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"],"version":3}
@@ -1 +1 @@
1
- {"version":3,"file":"pds-table-row.entry.cjs.js","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 >\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-cell part={this.tableRef.fixedColumn ? '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 />\n </pds-table-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"names":["closest","h","Host"],"mappings":"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"}
1
+ {"version":3,"file":"pds-table-row.entry.cjs.js","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"],"names":["closest","h","Host"],"mappings":"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"}
@@ -191,9 +191,9 @@ const PdsTable = class {
191
191
  }
192
192
  render() {
193
193
  if (this.responsive) {
194
- return (index.h(index.Host, { class: "pds-table is-responsive pds-table-responsive-host", id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0" }, index.h("div", { class: "scroll-shadow-left" }), index.h("div", { class: "scroll-shadow-right" }), index.h("div", { class: "pds-table-responsive-container" }, index.h("div", { class: "pds-table-responsive-wrapper" }, index.h("div", { class: this.classNames() }, index.h("slot", null))))));
194
+ return (index.h(index.Host, { class: "pds-table is-responsive pds-table-responsive-host", id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0", part: "table responsive-table" }, index.h("div", { class: "scroll-shadow-left", part: "scroll-shadow-left" }), index.h("div", { class: "scroll-shadow-right", part: "scroll-shadow-right" }), index.h("div", { class: "pds-table-responsive-container", part: "responsive-container" }, index.h("div", { class: "pds-table-responsive-wrapper", part: "responsive-wrapper" }, index.h("div", { class: this.classNames(), part: "table-inner" }, index.h("slot", null))))));
195
195
  }
196
- return (index.h(index.Host, { class: this.classNames(), id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0" }, index.h("slot", null)));
196
+ return (index.h(index.Host, { class: this.classNames(), id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0", part: "table" }, index.h("slot", null)));
197
197
  }
198
198
  get el() { return index.getElement(this); }
199
199
  };
@@ -1 +1 @@
1
- {"file":"pds-table.entry.cjs.js","mappings":";;;;AAAA,MAAM,WAAW,GAAG,07DAA07D;;MCOj8D,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAOU,QAAA,IAAe,CAAA,eAAA,GAAuB,IAAI;AAC1C,QAAA,IAAuB,CAAA,uBAAA,GAAwB,IAAI;AACnD,QAAA,IAAuB,CAAA,uBAAA,GAAwB,IAAI;AACnD,QAAA,IAAyB,CAAA,yBAAA,GAA0B,IAAI;AACvD,QAAA,IAAmB,CAAA,mBAAA,GAAwB,IAAI;AA2BvD;;;AAGG;AACM,QAAA,IAAa,CAAA,aAAA,GAAkB,IAAI;AAE5C;;;AAGG;AACM,QAAA,IAAgB,CAAA,gBAAA,GAAmB,KAAK;AAwPlD;IA3OC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,aAAa,GAAG,IAAI;;IAG3B,gBAAgB,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,IAAI,CAAC,wBAAwB,EAAE;;;IAInC,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,mBAAmB,EAAE;YAC5B,IAAI,CAAC,mBAAmB,EAAE;AAC1B,YAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI;;;AAInC;;;;;;;;;;;;;;;AAeG;IACK,wBAAwB,GAAA;;AAC9B,QAAA,MAAM,SAAS,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,EAAE,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,iCAAiC,CAAgB;AACrG,QAAA,MAAM,UAAU,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,EAAE,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,qBAAqB,CAAgB;AAC1F,QAAA,MAAM,WAAW,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,EAAE,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,sBAAsB,CAAgB;AAE5F,QAAA,IAAI,CAAC,SAAS,IAAI,CAAC,UAAU,IAAI,CAAC,WAAW;YAAE;;AAG/C,QAAA,IAAI,CAAC,eAAe,GAAG,SAAS;AAEhC;;;;AAIG;AACH,QAAA,IAAI,CAAC,uBAAuB,GAAG,MAAK;YAClC,IAAI,CAAC,IAAI,CAAC,eAAe;gBAAE;AAE3B,YAAA,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,UAAU;AAClD,YAAA,MAAM,aAAa,GAAG,IAAI,CAAC,eAAe,CAAC,WAAW,GAAG,IAAI,CAAC,eAAe,CAAC,WAAW;;YAGzF,UAAU,CAAC,KAAK,CAAC,OAAO,GAAG,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,GAAG,GAAG,GAAG;;YAG5E,WAAW,CAAC,KAAK,CAAC,OAAO,GAAG,CAAC,aAAa,GAAG,CAAC,IAAI,UAAU,GAAG,aAAa,GAAG,CAAC,IAAI,GAAG,GAAG,GAAG;AAC/F,SAAC;;AAGD,QAAA,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,uBAAuB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;;QAGhG,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,cAAc,EAAE;AAC1D,YAAA,IAAI;AACF,gBAAA,IAAI,CAAC,yBAAyB,GAAG,IAAI,cAAc,CAAC,MAAK;;oBACvD,CAAA,EAAA,GAAA,IAAI,CAAC,uBAAuB,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,CAAI;AAClC,iBAAC,CAAC;gBACF,IAAI,CAAC,yBAAyB,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC;;YAC5D,OAAO,KAAK,EAAE;;;;;;AAOlB,QAAA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;AACjC,YAAA,IAAI,CAAC,uBAAuB,GAAG,MAAK;;gBAClC,CAAA,EAAA,GAAA,IAAI,CAAC,uBAAuB,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,CAAI;AAClC,aAAC;YACD,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,uBAAuB,CAAC;;;AAIjE,QAAA,IAAI,CAAC,mBAAmB,GAAG,MAAK;YAC9B,IAAI,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,uBAAuB,EAAE;gBACxD,IAAI,CAAC,eAAe,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,uBAAuB,CAAC;AAChF,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI;;AAG7B,YAAA,IAAI,IAAI,CAAC,yBAAyB,EAAE;AAClC,gBAAA,IAAI,CAAC,yBAAyB,CAAC,UAAU,EAAE;AAC3C,gBAAA,IAAI,CAAC,yBAAyB,GAAG,IAAI;;YAGvC,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,IAAI,CAAC,uBAAuB,EAAE;gBACjE,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,uBAAuB,CAAC;AAClE,gBAAA,IAAI,CAAC,uBAAuB,GAAG,IAAI;;AAGrC,YAAA,IAAI,CAAC,uBAAuB,GAAG,IAAI;AACrC,SAAC;;QAGD,IAAI,CAAC,uBAAuB,EAAE;;IAIxB,UAAU,GAAA;AAChB,QAAA,MAAM,UAAU,GAAG,CAAC,WAAW,CAAC;AAEhC,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC;;AAG/B,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,YAAA,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;;AAGlC,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGtB,SAAS,CAAC,MAAc,EAAE,SAAyB,EAAA;QACzD,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC;;AAGzD,QAAA,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;;AAGzE,QAAA,MAAM,iBAAiB,GAAkB,KAAK,CAAC,IAAI,CACjD,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,+BAA+B,CAAC,CAC1D;QAED,MAAM,gBAAgB,GAAG,iBAAiB,CAAC,IAAI,CAC7C,CAAC,IAAI,KAAK,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,KAAK,MAAM,CAC3C;QAED,IAAI,CAAC,gBAAgB,EAAE;AACrB,YAAA,OAAO,CAAC,IAAI,CAAC,WAAW,MAAM,CAAA,YAAA,CAAc,CAAC;YAC7C;;QAGF,MAAM,WAAW,GAAG,iBAAiB,CAAC,OAAO,CAAC,gBAAgB,CAAC;;QAG/D,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAI;AACtB,YAAA,MAAM,MAAM,GAAG,CAAC,CAAC,aAAa,CAAC,CAA4B,yBAAA,EAAA,WAAW,GAAG,CAAC,GAAG,CAAC,CAAC,WAAW,CAAC,IAAI,EAAE;AACjG,YAAA,MAAM,MAAM,GAAG,CAAC,CAAC,aAAa,CAAC,CAA4B,yBAAA,EAAA,WAAW,GAAG,CAAC,GAAG,CAAC,CAAC,WAAW,CAAC,IAAI,EAAE;AAEjG,YAAA,IAAI,SAAS,KAAK,KAAK,EAAE;AACvB,gBAAA,OAAO,MAAM,CAAC,aAAa,CAAC,MAAM,EAAE,SAAS,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC;;iBAClE;AACL,gBAAA,OAAO,MAAM,CAAC,aAAa,CAAC,MAAM,EAAE,SAAS,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC;;AAE3E,SAAC,CAAC;;AAGF,QAAA,SAAS,CAAC,SAAS,GAAG,EAAE;AACxB,QAAA,SAAS,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;AACxB,YAAA,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC;AAC5B,SAAC,CAAC;;AAIJ,IAAA,eAAe,CAAC,KAAiE,EAAA;AAC/E,QAAA,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC,MAAM;QAClC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC;QAC9C,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM;AACxC,QAAA,IAAI,CAAC,gBAAgB,GAAG,SAAS;;AAInC,IAAA,oBAAoB,CAAC,KAA2C,EAAA;QAC9D,IAAI,KAAK,CAAC,gBAAgB;YAAE;QAE5B,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC;AAC5D,QAAA,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;AAE5E,QAAA,SAAS,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;YACxB,GAAG,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,UAAU;AAC1C,SAAC,CAAC;;IAIJ,MAAM,iBAAiB,CAAC,KAA6D,EAAA;QACnF,IAAI,KAAK,CAAC,gBAAgB;YAAE;QAE5B,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,eAAe,CAAC;QAC9D,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,UAAU,CAAC;QAC/E,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC;QACjF,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC;AAC5D,QAAA,IAAI,CAAC,YAAY;YAAE;QAEnB,MAAM,cAAc,GAAG,YAAY,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,CAAC;AAC5E,QAAA,cAAc,CAAC,OAAO,GAAG,eAAe;QACxC,cAAc,CAAC,aAAa,GAAG,CAAC,eAAe,IAAI,CAAC,gBAAgB;;IAGtE,MAAM,GAAA;AACJ,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,QACEA,OAAC,CAAAC,UAAI,EACH,EAAA,KAAK,EAAC,mDAAmD,EACzD,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAC,MAAM,EACX,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,QAAQ,EAAC,GAAG,EAAA,EAEZD,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,oBAAoB,EAAO,CAAA,EACtCA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,qBAAqB,EAAO,CAAA,EACvCA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,gCAAgC,EAAA,EACzCA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,8BAA8B,EAAA,EACvCA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAA,EAC3BA,OAAA,CAAA,MAAA,EAAA,IAAA,CAAa,CACT,CACF,CACF,CACD;;AAIX,QAAA,QACEA,OAAA,CAACC,UAAI,EAAA,EACH,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAC,MAAM,EACX,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,QAAQ,EAAC,GAAG,EAAA,EAEZD,OAAa,CAAA,MAAA,EAAA,IAAA,CAAA,CACR;;;;;;;;","names":["h","Host"],"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 >\n <div class=\"scroll-shadow-left\"></div>\n <div class=\"scroll-shadow-right\"></div>\n <div class=\"pds-table-responsive-container\">\n <div class=\"pds-table-responsive-wrapper\">\n <div class={this.classNames()}>\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 >\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pds-table.entry.cjs.js","mappings":"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","names":["h","Host"],"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"],"version":3}
@@ -1 +1 @@
1
- {"version":3,"file":"pds-table.entry.cjs.js","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 >\n <div class=\"scroll-shadow-left\"></div>\n <div class=\"scroll-shadow-right\"></div>\n <div class=\"pds-table-responsive-container\">\n <div class=\"pds-table-responsive-wrapper\">\n <div class={this.classNames()}>\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 >\n <slot></slot>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}
1
+ {"version":3,"file":"pds-table.entry.cjs.js","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"],"names":["h","Host"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
1
  import { Host, h } from "@stencil/core";
2
2
  export class PdsTableBody {
3
3
  render() {
4
- return (h(Host, { key: 'ec495e4227d7fb7defc4b4abf0afb8010f7ea984', role: "rowgroup" }, h("slot", { key: 'f9c42d628c86ed6098a42cc864122028711e3f15' })));
4
+ return (h(Host, { key: '7aa581f9cd4c798a5699664ca9639ec7e412a891', role: "rowgroup", part: "body" }, h("slot", { key: 'c06f2431044e64d934ee302e5c6fffbdaf0051c7' })));
5
5
  }
6
6
  static get is() { return "pds-table-body"; }
7
7
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"pds-table-body.js","sourceRoot":"","sources":["../../../../src/components/pds-table/pds-table-body/pds-table-body.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,YAAY;IAEvB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU;YACnB,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-table-body',\n styleUrls: ['pds-table-body.scss'],\n shadow: true,\n})\nexport class PdsTableBody {\n\n render() {\n return (\n <Host role=\"rowgroup\">\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"pds-table-body.js","sourceRoot":"","sources":["../../../../src/components/pds-table/pds-table-body/pds-table-body.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,YAAY;IAEvB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,MAAM;YAC/B,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-table-body',\n styleUrls: ['pds-table-body.scss'],\n shadow: true,\n})\nexport class PdsTableBody {\n\n render() {\n return (\n <Host role=\"rowgroup\" part=\"body\">\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
@@ -94,11 +94,11 @@ export class PdsTableCell {
94
94
  return classNames.join(' ');
95
95
  }
96
96
  render() {
97
- return (h(Host, { key: 'cc149f3d36c253ddd9c37ff435056be14ab8012d', class: this.classNames(), role: "gridcell", style: this.tableRef &&
97
+ return (h(Host, { key: 'eb6a58e7e294593a35b77f00d787fee3b2b03661', class: this.classNames(), role: "gridcell", part: "cell", style: this.tableRef &&
98
98
  this.tableRef.fixedColumn &&
99
99
  this.tableRef.selectable
100
100
  ? { '--fixed-cell-position': '40px' }
101
- : {} }, h("slot", { key: '5095b0541afada3a73422adcd8992f26b4e59235' })));
101
+ : {} }, h("slot", { key: 'c83fc4dda70196bf1032544353af058bc1a0decf' })));
102
102
  }
103
103
  static get is() { return "pds-table-cell"; }
104
104
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"pds-table-cell.js","sourceRoot":"","sources":["../../../../src/components/pds-table/pds-table-cell/pds-table-cell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, Prop, State, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-table-cell',\n styleUrls: ['pds-table-cell.scss'],\n shadow: true,\n})\nexport class PdsTableCell {\n @Element() hostElement: HTMLPdsTableCellElement;\n private tableRef: HTMLPdsTableElement;\n private scrollContainer: HTMLElement | null = null;\n private setupTimer: number | undefined;\n private setupRetries: number = 0;\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 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 * Sets the text alignment within the cell.\n */\n @Prop() cellAlign?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * Truncates content to a max width of 100px and adds an ellipsis.\n */\n @Prop() truncate: boolean;\n\n /**\n * Determines if the table is currently scrolling.\n * @defaultValue false\n */\n @State() private tableScrolling: boolean = false;\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-cell--align-${this.cellAlign}`);\n }\n\n if (this.truncate) {\n classNames.push('is-truncated');\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 /**\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 render() {\n return (\n <Host\n class={this.classNames()}\n role=\"gridcell\"\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 </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"pds-table-cell.js","sourceRoot":"","sources":["../../../../src/components/pds-table/pds-table-cell/pds-table-cell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, Prop, State, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-table-cell',\n styleUrls: ['pds-table-cell.scss'],\n shadow: true,\n})\nexport class PdsTableCell {\n @Element() hostElement: HTMLPdsTableCellElement;\n private tableRef: HTMLPdsTableElement;\n private scrollContainer: HTMLElement | null = null;\n private setupTimer: number | undefined;\n private setupRetries: number = 0;\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 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 * Sets the text alignment within the cell.\n */\n @Prop() cellAlign?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * Truncates content to a max width of 100px and adds an ellipsis.\n */\n @Prop() truncate: boolean;\n\n /**\n * Determines if the table is currently scrolling.\n * @defaultValue false\n */\n @State() private tableScrolling: boolean = false;\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-cell--align-${this.cellAlign}`);\n }\n\n if (this.truncate) {\n classNames.push('is-truncated');\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 /**\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 render() {\n return (\n <Host\n class={this.classNames()}\n role=\"gridcell\"\n part=\"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 </Host>\n );\n }\n}\n"]}
@@ -32,7 +32,7 @@ export class PdsTableHead {
32
32
  }
33
33
  }
34
34
  render() {
35
- return (h(Host, { key: 'ffa2760e5512a41cc8882722ea7ad7e5650de50f', role: "row" }, this.tableRef && this.tableRef.selectable && (h("pds-table-head-cell", { key: 'ba2e2ef60d570d739f5e582c0affe481ebed578d', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, h("pds-checkbox", { key: '4db057d54fbda8dccc49451ffb23ea1133fea53f', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected }))), h("slot", { key: '1f9167ccf1186c92033fa95b7e4a121b98d7c0ea' })));
35
+ return (h(Host, { key: 'dda71d591ccce76bdb055820c1c97358e545b522', role: "row", part: "head" }, this.tableRef && this.tableRef.selectable && (h("pds-table-head-cell", { key: '79bf1bd06b8e1ef05c9354c178787b4cff139e07', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, h("pds-checkbox", { key: '1ce038a3f3b9e038441fdf4b1d1fe4689f575604', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected, part: "select-all-checkbox" }))), h("slot", { key: 'f81d3922f892faa65abee99fd5af0d3232a25e9a' })));
36
36
  }
37
37
  static get is() { return "pds-table-head"; }
38
38
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"pds-table-head.js","sourceRoot":"","sources":["../../../../src/components/pds-table/pds-table-head/pds-table-head.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAOzC,MAAM,OAAO,YAAY;IALzB;QAyBU,qBAAgB,GAAG,GAAG,EAAE;YAC9B,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YAChE,MAAM,SAAS,GAAG,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;YACjE,MAAM,QAAQ,GAAG,GAAG,YAAY,IAAI,SAAS,EAAE,CAAC;YAEhD,OAAO,QAAQ,CAAC;QAClB,CAAC,CAAA;QAEO,gBAAW,GAAG,CAAC,EAAS,EAAE,EAAE;YAClC,IAAI,CAAC,UAAU,GAAG,CAAE,EAAE,CAAC,MAA2B,CAAC,OAAO,CAAA;YAC1D,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;QACpC,CAAC,CAAC;QAEM,iBAAY,GAAG,CAAC,UAAmB,EAAE,EAAE;YAC7C,IAAI,CAAC,aAAa,GAAG,KAAK,CAAA;YAE1B,IAAK,OAAO,CAAC,gBAAgB,EAAE,IAAI,CAAC,WAAW,CAAC,EAAG,CAAC;gBAClD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;YAC9C,CAAC;QACH,CAAC,CAAA;KAoCF;IAlCC,iBAAiB;QACf,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;QACpC,CAAC;IACH,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB,CAAC;QAE7E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;YAC/C,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,iCAAiC,CAAC,CAAC;YACpF,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QACvC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK;YACb,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,IAAI,CAC5C,4EAAqB,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE;gBACxE,qEACE,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,EACpC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,UAAU,GACxB,CACkB,CACvB;YACD,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { closest } from '@utils/closest';\n\n@Component({\n tag: 'pds-table-head',\n styleUrls: ['pds-table-head.scss'],\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n private tableRef: HTMLPdsTableElement\n\n /**\n * Determines if the select all checkbox is in an indeterminate state.\n */\n @Prop({ mutable: true }) indeterminate?: boolean;\n\n /**\n * Determines if the table row is currently selected.\n * @defaultValue false\n */\n @Prop({mutable: true}) 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 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 private handleInput = (ev: Event) => {\n this.isSelected = !(ev.target as HTMLInputElement).checked\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 this.pdsTableSelectAll.emit({ isSelected });\n }\n }\n\n componentWillLoad() {\n if (this.isSelected) {\n this.handleSelect(this.isSelected)\n }\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-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n\n render() {\n return (\n <Host role=\"row\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.selectable ? 'checkbox-cell' : ''}>\n <pds-checkbox\n componentId={this.generateUniqueId()}\n indeterminate={this.indeterminate}\n onInput={this.handleInput}\n label={\"Select All Rows\"}\n hideLabel={true}\n checked={this.isSelected}\n />\n </pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"pds-table-head.js","sourceRoot":"","sources":["../../../../src/components/pds-table/pds-table-head/pds-table-head.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAOzC,MAAM,OAAO,YAAY;IALzB;QAyBU,qBAAgB,GAAG,GAAG,EAAE;YAC9B,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YAChE,MAAM,SAAS,GAAG,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;YACjE,MAAM,QAAQ,GAAG,GAAG,YAAY,IAAI,SAAS,EAAE,CAAC;YAEhD,OAAO,QAAQ,CAAC;QAClB,CAAC,CAAA;QAEO,gBAAW,GAAG,CAAC,EAAS,EAAE,EAAE;YAClC,IAAI,CAAC,UAAU,GAAG,CAAE,EAAE,CAAC,MAA2B,CAAC,OAAO,CAAA;YAC1D,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;QACpC,CAAC,CAAC;QAEM,iBAAY,GAAG,CAAC,UAAmB,EAAE,EAAE;YAC7C,IAAI,CAAC,aAAa,GAAG,KAAK,CAAA;YAE1B,IAAK,OAAO,CAAC,gBAAgB,EAAE,IAAI,CAAC,WAAW,CAAC,EAAG,CAAC;gBAClD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;YAC9C,CAAC;QACH,CAAC,CAAA;KAqCF;IAnCC,iBAAiB;QACf,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;QACpC,CAAC;IACH,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB,CAAC;QAE7E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;YAC/C,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,iCAAiC,CAAC,CAAC;YACpF,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QACvC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM;YACzB,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,IAAI,CAC5C,4EAAqB,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE;gBACxE,qEACE,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,EACpC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,IAAI,EAAC,qBAAqB,GAC1B,CACkB,CACvB;YACD,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { closest } from '@utils/closest';\n\n@Component({\n tag: 'pds-table-head',\n styleUrls: ['pds-table-head.scss'],\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n private tableRef: HTMLPdsTableElement\n\n /**\n * Determines if the select all checkbox is in an indeterminate state.\n */\n @Prop({ mutable: true }) indeterminate?: boolean;\n\n /**\n * Determines if the table row is currently selected.\n * @defaultValue false\n */\n @Prop({mutable: true}) 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 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 private handleInput = (ev: Event) => {\n this.isSelected = !(ev.target as HTMLInputElement).checked\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 this.pdsTableSelectAll.emit({ isSelected });\n }\n }\n\n componentWillLoad() {\n if (this.isSelected) {\n this.handleSelect(this.isSelected)\n }\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-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n\n render() {\n return (\n <Host role=\"row\" part=\"head\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.selectable ? 'checkbox-cell' : ''}>\n <pds-checkbox\n componentId={this.generateUniqueId()}\n indeterminate={this.indeterminate}\n onInput={this.handleInput}\n label={\"Select All Rows\"}\n hideLabel={true}\n checked={this.isSelected}\n part=\"select-all-checkbox\"\n />\n </pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
@@ -118,11 +118,11 @@ export class PdsTableHeadCell {
118
118
  return classNames.join(' ');
119
119
  }
120
120
  render() {
121
- return (h(Host, { key: '037d0c1d3cf8122132bee6887bcaceb29ac33cc0', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, style: this.tableRef &&
121
+ return (h(Host, { key: 'f3b04da28997f6f471f6945e0cfac098dc1a6428', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, part: "head-cell", style: this.tableRef &&
122
122
  this.tableRef.fixedColumn &&
123
123
  this.tableRef.selectable
124
124
  ? { '--fixed-cell-position': '40px' }
125
- : {} }, h("slot", { key: 'ccfc2ea9a8301783834bda8c627afd652c22405e' }), this.sortable && (h("pds-icon", { key: 'de8a980b54bde4994f0339af5d7f3165ed35123b', icon: this.sortingDirection === 'asc' ? upSmall : downSmall }))));
125
+ : {} }, h("slot", { key: '832373d831d5f250f7427bf0a1f2756e0ce56ea9' }), this.sortable && (h("pds-icon", { key: '1886880fa50da3415b80a0abd8d571ca7350ca23', icon: this.sortingDirection === 'asc' ? upSmall : downSmall, part: "sort-icon" }))));
126
126
  }
127
127
  static get is() { return "pds-table-head-cell"; }
128
128
  static get encapsulation() { return "shadow"; }