@ukic/canary-web-components 2.0.0-canary.28 → 2.0.0-canary.29

package/hydrate/index.js

@@ -10690,7 +10690,7 @@ var descendingIcon = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24
     <path d="M16.01 11H4v2h12.01v3L20 12l-3.99-4z"></path>
 </svg>`;
 
-const icDataTableCss = "/*!@:host*/.sc-ic-data-table-h{position:relative;display:inline-flex;max-height:100%;width:var(--table-width, 100%);height:100%;min-width:var(--table-min-width);max-width:var(--table-max-width)}/*!@tbody*/tbody.sc-ic-data-table{vertical-align:top}/*!@.table-container*/.table-container.sc-ic-data-table{position:relative;height:calc(100% - var(--ic-space-xxxs));display:flex;flex-direction:column;width:100%}/*!@.cell-container*/.cell-container.sc-ic-data-table{display:flex;min-height:1.5rem;overflow-y:hidden;height:var(--row-height)}/*!@.truncation-show-hide*/.truncation-show-hide.sc-ic-data-table{overflow:visible;display:block}/*!@.cell-icon.truncation-show-hide*/.cell-icon.truncation-show-hide.sc-ic-data-table{display:flex}/*!@.cell-container:not(.data-type-element, .truncation-show-hide)*/.cell-container.sc-ic-data-table:not(.data-type-element,.truncation-show-hide).sc-ic-data-table{overflow-x:hidden}/*!@ic-loading-indicator*/ic-loading-indicator.sc-ic-data-table{position:sticky;top:20px}/*!@.table-row-container*/.table-row-container.sc-ic-data-table{position:relative;height:100%;overflow:auto;transition:var(--ic-easing-transition-fast);overflow-anchor:none}/*!@:host([show-pagination=\"true\"]) .table-row-container*/[show-pagination=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{height:calc(100% - 3.5625rem)}/*!@table*/table.sc-ic-data-table{table-layout:var(--table-layout, \"fixed\");border-spacing:0;width:100%;height:var(--table-height, auto)}/*!@.table-row-container:focus*/.table-row-container.sc-ic-data-table:focus{outline:none;box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast);z-index:1}/*!@:host([embedded=\"true\"]) .table-row-container*/[embedded=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{border:var(--ic-border-light)}/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{padding:var(--ic-space-xs);box-sizing:border-box}/*!@.column-header-sticky*/.column-header-sticky.sc-ic-data-table{position:sticky;top:0;z-index:1}/*!@.column-header-overlay*/.column-header-overlay.sc-ic-data-table{position:sticky;top:0;z-index:1;box-shadow:0 0.375rem var(--ic-space-xs) calc(var(--ic-space-xxs * -1))\n    rgb(0 0 0 / 20%)}/*!@.row-header-sticky*/.row-header-sticky.sc-ic-data-table{position:sticky;left:0}/*!@.column-header,\n.table-row*/.column-header.sc-ic-data-table,.table-row.sc-ic-data-table{box-sizing:border-box}/*!@.table-row-selected*/.table-row-selected.sc-ic-data-table{background-color:var(--ic-table-row-selected) !important}/*!@.sort-button*/.sort-button.sc-ic-data-table{margin-left:auto}/*!@.sort-button:hover*/.sort-button.sc-ic-data-table:hover{background-color:var(--ic-action-dark-bg-hover)}/*!@.sort-button:active*/.sort-button.sc-ic-data-table:active{background-color:var(--ic-action-dark-bg-active)}/*!@.sort-button svg*/.sort-button.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-architectural-black)}/*!@.sort-button-unsorted svg*/.sort-button-unsorted.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-color-tertiary-text)}/*!@.table-density-dense .column-header-inner-container,\ntd.table-density-dense*/.table-density-dense.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-dense.sc-ic-data-table{padding:var(--ic-space-xxs) var(--ic-space-xs) !important}/*!@.text-dense*/.text-dense.sc-ic-data-table{font-size:var(--ic-font-size-label)}/*!@.table-density-spacious .column-header-inner-container,\ntd.table-density-spacious*/.table-density-spacious.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-spacious.sc-ic-data-table{padding:0.625rem var(--ic-space-xs) !important}/*!@.text-spacious*/.text-spacious.sc-ic-data-table{font-size:1.125rem}/*!@.column-header-text*/.column-header-text.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.row-header,\n.column-header*/.row-header.sc-ic-data-table,.column-header.sc-ic-data-table{text-align:left;padding:var(--ic-space-xs);background-color:var(--ic-architectural-40);border-right:var(--ic-border-light);border-bottom:var(--ic-border-light)}/*!@.column-header*/.column-header.sc-ic-data-table{padding:0;width:var(--column-width);min-width:var(--column-min-width, 4rem);max-width:var(--column-max-width)}/*!@.column-header:last-child*/.column-header.sc-ic-data-table:last-child{border-right:none}/*!@.scrollable .column-header:last-child*/.scrollable.sc-ic-data-table .column-header.sc-ic-data-table:last-child{border-right:var(--ic-border-light) !important}/*!@:host([embedded=\"true\"]) tr:last-child .table-cell,\n:host([embedded=\"true\"]) tr:last-child .row-header*/[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .table-cell.sc-ic-data-table,[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .row-header.sc-ic-data-table{border-bottom:none}/*!@.column-header-alignment-left,\n.row-header-alignment-left,\n.cell-alignment-left*/.column-header-alignment-left.sc-ic-data-table,.row-header-alignment-left.sc-ic-data-table,.cell-alignment-left.sc-ic-data-table{text-align:left !important;justify-content:start !important}/*!@.column-header-alignment-right,\n.row-header-alignment-right,\n.cell-alignment-right*/.column-header-alignment-right.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table{text-align:right !important;justify-content:end !important}/*!@.cell-alignment-right.truncation-tooltip ic-tooltip ic-typography*/.cell-alignment-right.truncation-tooltip.sc-ic-data-table ic-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.cell-alignment-right.truncation-show-hide ic-typography*/.cell-alignment-right.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{--ellipsis-padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.column-header-alignment-center,\n.row-header-alignment-center,\n.cell-alignment-center*/.column-header-alignment-center.sc-ic-data-table,.row-header-alignment-center.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table{text-align:center !important;justify-content:center !important}/*!@.table-row:nth-child(even)*/.table-row.sc-ic-data-table:nth-child(even){background-color:var(--ic-architectural-20)}/*!@.table-cell*/.table-cell.sc-ic-data-table{padding:var(--ic-space-xs);border-bottom:solid var(--ic-architectural-100) var(--ic-space-1px);overflow:hidden;box-sizing:border-box;max-width:var(--column-max-width);min-width:var(--column-min-width)}/*!@.table-cell.with-overflow*/.table-cell.with-overflow.sc-ic-data-table{overflow:visible}/*!@.data-type-string,\n.data-type-address*/.data-type-string.sc-ic-data-table,.data-type-address.sc-ic-data-table{text-align:left;vertical-align:top}/*!@.data-type-number,\n.data-type-date*/.data-type-number.sc-ic-data-table,.data-type-date.sc-ic-data-table{text-align:right;justify-content:end;vertical-align:top}/*!@.cell-alignment-top*/.cell-alignment-top.sc-ic-data-table{vertical-align:top;align-items:flex-start}/*!@.cell-alignment-middle*/.cell-alignment-middle.sc-ic-data-table{vertical-align:middle;align-items:center}/*!@.cell-alignment-bottom*/.cell-alignment-bottom.sc-ic-data-table{vertical-align:bottom;align-items:flex-end}/*!@.cell-emphasis-low*/.cell-emphasis-low.sc-ic-data-table{color:var(--ic-color-secondary-text)}/*!@.cell-emphasis-high*/.cell-emphasis-high.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.pagination-container*/.pagination-container.sc-ic-data-table{background-color:var(--ic-architectural-40);border-top:var(--ic-border-light)}/*!@.screen-reader-sort-text,\n.table-caption*/.screen-reader-sort-text.sc-ic-data-table,.table-caption.sc-ic-data-table{position:absolute;left:-100rem}/*!@.table-cell,\n.column-header,\n.row-header*/.table-cell.sc-ic-data-table,.column-header.sc-ic-data-table,.row-header.sc-ic-data-table{word-wrap:break-word;white-space:pre-wrap}/*!@.loading-empty*/.loading-empty.sc-ic-data-table{padding:var(--ic-space-xl) var(--ic-space-xxl);margin-top:var(--ic-space-xl)}/*!@.updating-state*/.updating-state.sc-ic-data-table{padding:0;border-bottom:var(--ic-border-light)}/*!@.updating-state-headers*/.updating-state-headers.sc-ic-data-table{border-bottom:none}/*!@.loading*/.loading.sc-ic-data-table{position:absolute;left:calc(50% - 5.9741rem);opacity:0;transition:opacity var(--ic-transition-duration-slow)}/*!@.loading.show-background*/.loading.show-background.sc-ic-data-table{background-color:var(--ic-architectural-white);border:var(--ic-border-light)}/*!@.loading.show*/.loading.show.sc-ic-data-table{opacity:1}/*!@.icon,\n::slotted(svg)*/.icon.sc-ic-data-table,.sc-ic-data-table-s>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-right:var(--ic-space-xxs)}/*!@.column-header-alignment-right > .icon,\n.row-header-alignment-right > .icon,\n.cell-alignment-right > .icon,\n.column-header-alignment-right > ::slotted(svg),\n.row-header-alignment-right > ::slotted(svg),\n.cell-alignment-right > ::slotted(svg)*/.column-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.column-header-alignment-right>.sc-ic-data-table-s>svg,.row-header-alignment-right>.sc-ic-data-table-s>svg,.cell-alignment-right>.sc-ic-data-table-s>svg{margin-right:auto}/*!@.column-header-alignment-center > ic-typography,\n.row-header-alignment-right > ic-typography,\n.cell-alignment-center > ic-typography*/.column-header-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>ic-typography.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table{flex:1}/*!@.icon > svg*/.icon.sc-ic-data-table>svg.sc-ic-data-table{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}/*!@.truncation-tooltip ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{display:-webkit-box;-webkit-line-clamp:var(--ic-line-clamp, 0);-webkit-box-orient:vertical;overflow:hidden}/*!@.truncation-tooltip ic-typography,\n.truncation-show-hide ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table,.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{white-space:normal}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-data-table{overflow:hidden;width:100%}@media screen and (min-width: 577px){/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{display:flex;align-items:center}}";
+const icDataTableCss = "/*!@:host*/.sc-ic-data-table-h{position:relative;display:inline-flex;max-height:100%;width:var(--table-width, 100%);height:100%;min-width:var(--table-min-width);max-width:var(--table-max-width)}/*!@tbody*/tbody.sc-ic-data-table{vertical-align:top}/*!@.table-container*/.table-container.sc-ic-data-table{position:relative;height:calc(100% - var(--ic-space-xxxs));display:flex;flex-direction:column;width:100%}/*!@.cell-container*/.cell-container.sc-ic-data-table{display:flex;min-height:1.5rem;overflow-y:hidden;height:var(--row-height)}/*!@.truncation-show-hide*/.truncation-show-hide.sc-ic-data-table{overflow:visible;display:block}/*!@.cell-icon.truncation-show-hide*/.cell-icon.truncation-show-hide.sc-ic-data-table{display:flex}/*!@.cell-container:not(.data-type-element, .truncation-show-hide)*/.cell-container.sc-ic-data-table:not(.data-type-element,.truncation-show-hide).sc-ic-data-table{overflow-x:hidden}/*!@ic-loading-indicator*/ic-loading-indicator.sc-ic-data-table{position:sticky;top:20px}/*!@.table-row-container*/.table-row-container.sc-ic-data-table{position:relative;height:100%;overflow:auto;transition:var(--ic-easing-transition-fast);overflow-anchor:none}/*!@:host([show-pagination=\"true\"]) .table-row-container*/[show-pagination=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{height:calc(100% - 3.5625rem)}/*!@table*/table.sc-ic-data-table{table-layout:var(--table-layout, \"fixed\");border-spacing:0;width:100%;height:var(--table-height, auto)}/*!@.table-row-container:focus*/.table-row-container.sc-ic-data-table:focus{outline:none;box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast);z-index:1}/*!@:host([embedded=\"true\"]) .table-row-container*/[embedded=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{border:var(--ic-border-light)}/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{padding:var(--ic-space-xs);box-sizing:border-box}/*!@.column-header-inner-container ic-tooltip*/.column-header-inner-container.sc-ic-data-table ic-tooltip.sc-ic-data-table{pointer-events:none}/*!@.column-header-inner-container ic-tooltip.show-trunc-tooltip*/.column-header-inner-container.sc-ic-data-table ic-tooltip.show-trunc-tooltip.sc-ic-data-table{pointer-events:auto}/*!@.column-header-inner-container ic-tooltip .column-header-text*/.column-header-inner-container.sc-ic-data-table ic-tooltip.sc-ic-data-table .column-header-text.sc-ic-data-table{--ic-line-clamp:1}/*!@.column-header-sticky*/.column-header-sticky.sc-ic-data-table{position:sticky;top:0;z-index:1}/*!@.column-header-overlay*/.column-header-overlay.sc-ic-data-table{position:sticky;top:0;z-index:1;box-shadow:0 0.375rem var(--ic-space-xs) calc(var(--ic-space-xxs * -1))\n    rgb(0 0 0 / 20%)}/*!@.row-header-sticky*/.row-header-sticky.sc-ic-data-table{position:sticky;left:0}/*!@.column-header,\n.table-row*/.column-header.sc-ic-data-table,.table-row.sc-ic-data-table{box-sizing:border-box}/*!@.table-row-selected*/.table-row-selected.sc-ic-data-table{background-color:var(--ic-table-row-selected) !important}/*!@.sort-button*/.sort-button.sc-ic-data-table{margin-left:auto}/*!@.sort-button:hover*/.sort-button.sc-ic-data-table:hover{background-color:var(--ic-action-dark-bg-hover)}/*!@.sort-button:active*/.sort-button.sc-ic-data-table:active{background-color:var(--ic-action-dark-bg-active)}/*!@.sort-button svg*/.sort-button.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-architectural-black)}/*!@.sort-button-unsorted svg*/.sort-button-unsorted.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-color-tertiary-text)}/*!@.table-density-dense .column-header-inner-container,\ntd.table-density-dense*/.table-density-dense.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-dense.sc-ic-data-table{padding:var(--ic-space-xxs) var(--ic-space-xs) !important}/*!@.text-dense*/.text-dense.sc-ic-data-table{font-size:var(--ic-font-size-label)}/*!@.table-density-spacious .column-header-inner-container,\ntd.table-density-spacious*/.table-density-spacious.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-spacious.sc-ic-data-table{padding:0.625rem var(--ic-space-xs) !important}/*!@.text-spacious*/.text-spacious.sc-ic-data-table{font-size:1.125rem}/*!@.column-header-text*/.column-header-text.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.dummy-column-header-text*/.dummy-column-header-text.sc-ic-data-table{white-space:nowrap;overflow:hidden;height:0;width:-moz-fit-content;width:fit-content}/*!@.row-header,\n.column-header*/.row-header.sc-ic-data-table,.column-header.sc-ic-data-table{text-align:left;padding:var(--ic-space-xs);background-color:var(--ic-architectural-40);border-right:var(--ic-border-light);border-bottom:var(--ic-border-light)}/*!@.column-header*/.column-header.sc-ic-data-table{padding:0;width:var(--column-width);min-width:var(--column-min-width, 4rem);max-width:var(--column-max-width)}/*!@.column-header:last-child*/.column-header.sc-ic-data-table:last-child{border-right:none}/*!@.scrollable .column-header:last-child*/.scrollable.sc-ic-data-table .column-header.sc-ic-data-table:last-child{border-right:var(--ic-border-light) !important}/*!@:host([embedded=\"true\"]) tr:last-child .table-cell,\n:host([embedded=\"true\"]) tr:last-child .row-header*/[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .table-cell.sc-ic-data-table,[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .row-header.sc-ic-data-table{border-bottom:none}/*!@.column-header-alignment-left,\n.row-header-alignment-left,\n.cell-alignment-left*/.column-header-alignment-left.sc-ic-data-table,.row-header-alignment-left.sc-ic-data-table,.cell-alignment-left.sc-ic-data-table{text-align:left !important;justify-content:start !important}/*!@.column-header-alignment-right,\n.row-header-alignment-right,\n.cell-alignment-right*/.column-header-alignment-right.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table{text-align:right !important;justify-content:end !important}/*!@.cell-alignment-right.truncation-tooltip ic-tooltip ic-typography*/.cell-alignment-right.truncation-tooltip.sc-ic-data-table ic-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.cell-alignment-right.truncation-show-hide ic-typography*/.cell-alignment-right.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{--ellipsis-padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.column-header-alignment-center,\n.row-header-alignment-center,\n.cell-alignment-center*/.column-header-alignment-center.sc-ic-data-table,.row-header-alignment-center.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table{text-align:center !important;justify-content:center !important}/*!@.table-row:nth-child(even)*/.table-row.sc-ic-data-table:nth-child(even){background-color:var(--ic-architectural-20)}/*!@.table-cell*/.table-cell.sc-ic-data-table{padding:var(--ic-space-xs);border-bottom:solid var(--ic-architectural-100) var(--ic-space-1px);overflow:hidden;box-sizing:border-box;max-width:var(--column-max-width);min-width:var(--column-min-width)}/*!@.table-cell.with-overflow*/.table-cell.with-overflow.sc-ic-data-table{overflow:visible}/*!@.data-type-string,\n.data-type-address*/.data-type-string.sc-ic-data-table,.data-type-address.sc-ic-data-table{text-align:left;vertical-align:top}/*!@.data-type-number,\n.data-type-date*/.data-type-number.sc-ic-data-table,.data-type-date.sc-ic-data-table{text-align:right;justify-content:end;vertical-align:top}/*!@.cell-alignment-top*/.cell-alignment-top.sc-ic-data-table{vertical-align:top;align-items:flex-start}/*!@.cell-alignment-middle*/.cell-alignment-middle.sc-ic-data-table{vertical-align:middle;align-items:center}/*!@.cell-alignment-bottom*/.cell-alignment-bottom.sc-ic-data-table{vertical-align:bottom;align-items:flex-end}/*!@.cell-emphasis-low*/.cell-emphasis-low.sc-ic-data-table{color:var(--ic-color-secondary-text)}/*!@.cell-emphasis-high*/.cell-emphasis-high.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.pagination-container*/.pagination-container.sc-ic-data-table{background-color:var(--ic-architectural-40);border-top:var(--ic-border-light)}/*!@.screen-reader-sort-text,\n.table-caption*/.screen-reader-sort-text.sc-ic-data-table,.table-caption.sc-ic-data-table{position:absolute;left:-100rem}/*!@.table-cell,\n.column-header,\n.row-header*/.table-cell.sc-ic-data-table,.column-header.sc-ic-data-table,.row-header.sc-ic-data-table{word-wrap:break-word;white-space:pre-wrap}/*!@.loading-empty*/.loading-empty.sc-ic-data-table{padding:var(--ic-space-xl) var(--ic-space-xxl);margin-top:var(--ic-space-xl)}/*!@.updating-state*/.updating-state.sc-ic-data-table{padding:0;border-bottom:var(--ic-border-light)}/*!@.updating-state-headers*/.updating-state-headers.sc-ic-data-table{border-bottom:none}/*!@.loading*/.loading.sc-ic-data-table{position:absolute;left:calc(50% - 5.9741rem);opacity:0;transition:opacity var(--ic-transition-duration-slow)}/*!@.loading.show-background*/.loading.show-background.sc-ic-data-table{background-color:var(--ic-architectural-white);border:var(--ic-border-light)}/*!@.loading.show*/.loading.show.sc-ic-data-table{opacity:1}/*!@.icon,\n::slotted(svg)*/.icon.sc-ic-data-table,.sc-ic-data-table-s>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-right:var(--ic-space-xxs)}/*!@.column-header-alignment-right > .icon,\n.row-header-alignment-right > .icon,\n.cell-alignment-right > .icon,\n.column-header-alignment-right > ::slotted(svg),\n.row-header-alignment-right > ::slotted(svg),\n.cell-alignment-right > ::slotted(svg)*/.column-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.column-header-alignment-right>.sc-ic-data-table-s>svg,.row-header-alignment-right>.sc-ic-data-table-s>svg,.cell-alignment-right>.sc-ic-data-table-s>svg{margin-right:auto}/*!@.column-header-alignment-center > ic-typography,\n.row-header-alignment-right > ic-typography,\n.cell-alignment-center > ic-typography*/.column-header-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>ic-typography.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table{flex:1}/*!@.icon > svg*/.icon.sc-ic-data-table>svg.sc-ic-data-table{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}/*!@.truncation-tooltip ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{display:-webkit-box;-webkit-line-clamp:var(--ic-line-clamp, 0);-webkit-box-orient:vertical;overflow:hidden}/*!@.truncation-tooltip ic-typography,\n.truncation-show-hide ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table,.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{white-space:normal}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-data-table{overflow:hidden;width:100%}@media screen and (min-width: 577px){/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{display:flex;align-items:center}}";
 
 /**
  * @slot empty-state - Content is slotted below the table header when there is no data and the table is not loading.
@@ -10738,6 +10738,34 @@ class DataTable {
         this.densityUpdate = false;
         this.truncationPatternUpdated = false;
         this.isNewDebounceDelaySet = false;
+        this.headerResizeObserver = null;
+        this.IC_TOOLTIP_STRING = "ic-tooltip";
+        this.SHOW_TRUNC_TOOLTIP_STRING = "show-trunc-tooltip";
+        this.runHeaderResizeObserver = () => {
+            this.headerResizeObserver = new ResizeObserver(() => {
+                this.headerResizeCallback();
+            });
+            this.headerResizeObserver.observe(this.el);
+        };
+        this.headerResizeCallback = () => {
+            if (!this.hideColumnHeaders && this.columnHeaderTruncation) {
+                const tableContainerWidth = this.el.shadowRoot.querySelector(".table-container").clientWidth;
+                if (tableContainerWidth !== this.prevTableContainerWidth) {
+                    const headers = this.el.shadowRoot.querySelectorAll("th.column-header");
+                    headers.forEach((header) => {
+                        const tooltip = header.querySelector(this.IC_TOOLTIP_STRING);
+                        const typographyEls = header.querySelectorAll("ic-typography");
+                        if (tooltip && typographyEls && typographyEls.length === 2) {
+                            tooltip.classList.remove(this.SHOW_TRUNC_TOOLTIP_STRING);
+                            if (typographyEls[1].clientWidth > typographyEls[0].clientWidth) {
+                                tooltip.classList.add(this.SHOW_TRUNC_TOOLTIP_STRING);
+                            }
+                        }
+                    });
+                    this.prevTableContainerWidth = tableContainerWidth;
+                }
+            }
+        };
         this.updateSetRowHeight = (typographyEl) => {
             const fontSize = parseInt(getComputedStyle(document.documentElement).fontSize);
             if (typographyEl) {
@@ -11003,18 +11031,22 @@ class DataTable {
             });
         };
         this.createColumnHeaders = () => {
-            return this.columns.map(({ cellAlignment, colspan, icon, key, title, columnWidth }) => (hAsync("th", { scope: "col", class: {
+            return this.columns.map(({ cellAlignment, colspan, icon, key, title, columnWidth }, index) => (hAsync("th", { scope: "col", class: {
                     ["column-header"]: true,
                     [`table-density-${this.density}`]: this.notDefaultDensity(),
                     ["updating-state-headers"]: this.updating && !this.loading,
                 }, style: Object.assign({}, this.getColumnWidth(columnWidth)), colSpan: colspan }, hAsync("div", { class: {
                     "column-header-inner-container": true,
+                    "truncation-tooltip": this.columnHeaderTruncation,
                     [`column-header-alignment-${cellAlignment}`]: !!cellAlignment,
                 } }, isSlotUsed(this.el, `${key}-column-icon`) ? (hAsync("slot", { name: `${key}-column-icon` })) : (icon &&
-                !icon.hideOnHeader && (hAsync("span", { class: "icon", innerHTML: icon.icon }))), hAsync("ic-typography", { variant: "body", class: {
+                !icon.hideOnHeader && (hAsync("span", { class: "icon", innerHTML: icon.icon }))), this.columnHeaderTruncation ? (hAsync("ic-tooltip", { label: title, target: `column-header-${index}` }, hAsync("ic-typography", { id: `column-header-${index}`, variant: "body", class: {
                     ["column-header-text"]: true,
                     [`text-${this.density}`]: this.notDefaultDensity(),
-                } }, title), this.sortable && (hAsync("ic-button", { variant: "icon", id: `sort-button-${key}`, "aria-label": this.getSortButtonLabel(key),
+                } }, title))) : (hAsync("ic-typography", { variant: "body", class: {
+                    ["column-header-text"]: true,
+                    [`text-${this.density}`]: this.notDefaultDensity(),
+                } }, title)), this.sortable && (hAsync("ic-button", { variant: "icon", id: `sort-button-${key}`, "aria-label": this.getSortButtonLabel(key),
                 // eslint-disable-next-line react/jsx-no-bind
                 onClick: () => this.sortRows(key), innerHTML: this.SORT_ICONS[this.sortedColumn === key
                     ? this.sortedColumnOrder
@@ -11022,7 +11054,11 @@ class DataTable {
                     ["sort-button"]: true,
                     ["sort-button-unsorted"]: this.sortedColumn !== key ||
                         this.sortedColumnOrder === "unsorted",
-                } }))))));
+                } }))), this.columnHeaderTruncation && (hAsync("ic-typography", { variant: "body", "aria-hidden": "true", class: {
+                    ["column-header-text"]: true,
+                    ["dummy-column-header-text"]: this.columnHeaderTruncation,
+                    [`text-${this.density}`]: this.notDefaultDensity(),
+                } }, title)))));
         };
         this.onRowClick = (row) => {
             this.selectedRow =
@@ -11167,7 +11203,7 @@ class DataTable {
                     var _a;
                     const tooltipEl = (slottedEl.tagName === "IC-TOOLTIP"
                         ? slottedEl
-                        : (_a = slottedEl.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("ic-tooltip"));
+                        : (_a = slottedEl.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(this.IC_TOOLTIP_STRING));
                     if (tooltipEl) {
                         tooltipEl.setExternalPopperProps({
                             strategy: "fixed",
@@ -11188,6 +11224,7 @@ class DataTable {
         this.currentRowHeight = undefined;
         this.debounceDelay = 0;
         this.caption = undefined;
+        this.columnHeaderTruncation = false;
         this.columns = undefined;
         this.data = undefined;
         this.density = "default";
@@ -11232,9 +11269,24 @@ class DataTable {
         this.variableRowHeight = undefined;
         this.width = undefined;
     }
+    headerTruncationChangeHandler() {
+        if (this.columnHeaderTruncation) {
+            this.prevTableContainerWidth = 0;
+        }
+        else {
+            const headers = this.el.shadowRoot.querySelectorAll("th.column-header");
+            headers.forEach((header) => {
+                const tooltip = header.querySelector(this.IC_TOOLTIP_STRING);
+                if (tooltip) {
+                    tooltip.classList.remove(this.SHOW_TRUNC_TOOLTIP_STRING);
+                }
+            });
+        }
+    }
     disconnectedCallback() {
-        var _a;
+        var _a, _b;
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        (_b = this.headerResizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
     }
     componentWillLoad() {
         var _a;
@@ -11250,6 +11302,7 @@ class DataTable {
     componentDidLoad() {
         const tableElement = this.el.shadowRoot.querySelector("table");
         const tableContainer = this.el.shadowRoot.querySelector(".table-container");
+        checkResizeObserver(this.runHeaderResizeObserver);
         if (this.dataUpdated) {
             this.dataUpdated = false;
         }
@@ -11664,7 +11717,7 @@ class DataTable {
         typographyEl.setAttribute("style", `--ic-line-clamp: ${this.getLines(cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight)}`);
     }
     createTruncationTooltip(typographyEl, cellContainer) {
-        const tooltipEl = document.createElement("ic-tooltip");
+        const tooltipEl = document.createElement(this.IC_TOOLTIP_STRING);
         tooltipEl.setAttribute("target", typographyEl.id);
         tooltipEl.setAttribute("label", typographyEl.textContent);
         tooltipEl.classList.add("ic-tooltip-overflow");
@@ -11699,6 +11752,7 @@ class DataTable {
     }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "columnHeaderTruncation": ["headerTruncationChangeHandler"],
         "loading": ["loadingHandler"],
         "truncationPattern": ["truncationPatternHandler"],
         "data": ["dataHandler"],
@@ -11712,6 +11766,7 @@ class DataTable {
         "$tagName$": "ic-data-table",
         "$members$": {
             "caption": [1],
+            "columnHeaderTruncation": [4, "column-header-truncation"],
             "columns": [16],
             "data": [16],
             "density": [1025],
@@ -11963,7 +12018,7 @@ var Calendar = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" v
   <path d="M16.6667 2.50004H15.8334V0.833374H14.1667V2.50004H5.83342V0.833374H4.16675V2.50004H3.33341C2.41675 2.50004 1.66675 3.25004 1.66675 4.16671V17.5C1.66675 18.4167 2.41675 19.1667 3.33341 19.1667H16.6667C17.5834 19.1667 18.3334 18.4167 18.3334 17.5V4.16671C18.3334 3.25004 17.5834 2.50004 16.6667 2.50004ZM16.6667 17.5H3.33341V6.66671H16.6667V17.5Z" fill="currentColor"/>
 </svg>`;
 
-const icDateInputCss = "/*!@html*/html.sc-ic-date-input{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-date-input{margin:0}/*!@main*/main.sc-ic-date-input{display:block}/*!@h1*/h1.sc-ic-date-input{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-date-input{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-date-input{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-date-input{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-date-input{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-date-input,strong.sc-ic-date-input{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-date-input,kbd.sc-ic-date-input,samp.sc-ic-date-input{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-date-input{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-date-input,sup.sc-ic-date-input{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-date-input{bottom:-0.25em}/*!@sup*/sup.sc-ic-date-input{top:-0.5em}/*!@img*/img.sc-ic-date-input{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-date-input,input.sc-ic-date-input,optgroup.sc-ic-date-input,select.sc-ic-date-input,textarea.sc-ic-date-input{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-date-input,input.sc-ic-date-input{overflow:visible}/*!@button,\nselect*/button.sc-ic-date-input,select.sc-ic-date-input{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-date-input,[type=\"button\"].sc-ic-date-input,[type=\"reset\"].sc-ic-date-input,[type=\"submit\"].sc-ic-date-input{-webkit-appearance:button}/*!@button::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner*/button.sc-ic-date-input::-moz-focus-inner,[type=\"button\"].sc-ic-date-input::-moz-focus-inner,[type=\"reset\"].sc-ic-date-input::-moz-focus-inner,[type=\"submit\"].sc-ic-date-input::-moz-focus-inner{border-style:none;padding:0}/*!@button:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring*/button.sc-ic-date-input:-moz-focusring,[type=\"button\"].sc-ic-date-input:-moz-focusring,[type=\"reset\"].sc-ic-date-input:-moz-focusring,[type=\"submit\"].sc-ic-date-input:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-date-input{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-date-input{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-date-input{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-date-input{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-date-input,[type=\"radio\"].sc-ic-date-input{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-date-input::-webkit-inner-spin-button,[type=\"number\"].sc-ic-date-input::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-date-input{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-date-input::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-date-input::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-date-input{display:block}/*!@summary*/summary.sc-ic-date-input{display:list-item}/*!@template*/template.sc-ic-date-input{display:none}/*!@[hidden]*/[hidden].sc-ic-date-input{display:none}/*!@html,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo*/html.sc-ic-date-input,body.sc-ic-date-input,div.sc-ic-date-input,span.sc-ic-date-input,applet.sc-ic-date-input,object.sc-ic-date-input,iframe.sc-ic-date-input,h1.sc-ic-date-input,h2.sc-ic-date-input,h3.sc-ic-date-input,h4.sc-ic-date-input,h5.sc-ic-date-input,h6.sc-ic-date-input,p.sc-ic-date-input,blockquote.sc-ic-date-input,pre.sc-ic-date-input,a.sc-ic-date-input,abbr.sc-ic-date-input,acronym.sc-ic-date-input,address.sc-ic-date-input,big.sc-ic-date-input,cite.sc-ic-date-input,code.sc-ic-date-input,del.sc-ic-date-input,dfn.sc-ic-date-input,em.sc-ic-date-input,img.sc-ic-date-input,ins.sc-ic-date-input,kbd.sc-ic-date-input,q.sc-ic-date-input,s.sc-ic-date-input,samp.sc-ic-date-input,small.sc-ic-date-input,strike.sc-ic-date-input,strong.sc-ic-date-input,sub.sc-ic-date-input,sup.sc-ic-date-input,tt.sc-ic-date-input,var.sc-ic-date-input,b.sc-ic-date-input,u.sc-ic-date-input,i.sc-ic-date-input,center.sc-ic-date-input,dl.sc-ic-date-input,dt.sc-ic-date-input,dd.sc-ic-date-input,ol.sc-ic-date-input,ul.sc-ic-date-input,li.sc-ic-date-input,fieldset.sc-ic-date-input,form.sc-ic-date-input,label.sc-ic-date-input,legend.sc-ic-date-input,table.sc-ic-date-input,caption.sc-ic-date-input,tbody.sc-ic-date-input,tfoot.sc-ic-date-input,thead.sc-ic-date-input,tr.sc-ic-date-input,th.sc-ic-date-input,td.sc-ic-date-input,article.sc-ic-date-input,aside.sc-ic-date-input,canvas.sc-ic-date-input,details.sc-ic-date-input,embed.sc-ic-date-input,figure.sc-ic-date-input,figcaption.sc-ic-date-input,footer.sc-ic-date-input,header.sc-ic-date-input,hgroup.sc-ic-date-input,menu.sc-ic-date-input,nav.sc-ic-date-input,output.sc-ic-date-input,ruby.sc-ic-date-input,section.sc-ic-date-input,summary.sc-ic-date-input,time.sc-ic-date-input,mark.sc-ic-date-input,audio.sc-ic-date-input,video.sc-ic-date-input{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@input*/input.sc-ic-date-input{border:0;height:100%;padding:0;outline:none;background:none;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}/*!@input::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button*/input.sc-ic-date-input::-webkit-outer-spin-button,input.sc-ic-date-input::-webkit-inner-spin-button{-webkit-appearance:none}/*!@ic-input-component-container*/ic-input-component-container.sc-ic-date-input{cursor:text}/*!@ic-input-component-container,\nic-input-component-container:hover*/ic-input-component-container.sc-ic-date-input,ic-input-component-container.sc-ic-date-input:hover{color:var(--ic-color-tertiary-text)}/*!@ic-input-component-container .focus-indicator*/ic-input-component-container.sc-ic-date-input .focus-indicator.sc-ic-date-input{padding:var(--ic-space-xxxs) var(--ic-space-xs);align-items:center}/*!@.day-input*/.day-input.sc-ic-date-input{width:1.438rem}/*!@.month-input*/.month-input.sc-ic-date-input{width:1.813rem}/*!@.year-input,\n.year-input.fit-to-value*/.year-input.sc-ic-date-input,.year-input.fit-to-value.sc-ic-date-input{width:2.313rem}/*!@.fit-to-value*/.fit-to-value.sc-ic-date-input{width:1.25rem}/*!@.sr-only*/.sr-only.sc-ic-date-input{position:absolute;left:-9999px}/*!@.input-container*/.input-container.sc-ic-date-input{width:100%;display:flex;justify-content:space-between;align-items:center;position:relative}/*!@.action-buttons*/.action-buttons.sc-ic-date-input{display:flex;align-items:center}/*!@.show-calendar-button-wrapper*/.show-calendar-button-wrapper.sc-ic-date-input{display:flex;justify-content:center;align-items:center}/*!@.clear-button,\n.calendar-button*/.clear-button.sc-ic-date-input,.calendar-button.sc-ic-date-input{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition);margin:0}/*!@.clear-button.hidden*/.clear-button.hidden.sc-ic-date-input{display:none}/*!@.clear-button:focus,\n.calendar-button:focus,\n.clear-button:active,\n.calendar-button:active*/.clear-button.sc-ic-date-input:focus,.calendar-button.sc-ic-date-input:focus,.clear-button.sc-ic-date-input:active,.calendar-button.sc-ic-date-input:active{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow) !important;border-radius:0.25rem}/*!@.clear-button:focus,\n.calendar-button:focus,\n.clear-button:active *,\n.calendar-button:active **/.clear-button.sc-ic-date-input:focus,.calendar-button.sc-ic-date-input:focus,.clear-button.sc-ic-date-input:active *.sc-ic-date-input,.calendar-button.sc-ic-date-input:active *.sc-ic-date-input{fill:var(--ic-architectural-white)}/*!@.divider*/.divider.sc-ic-date-input{margin:0 var(--ic-space-xxs);width:var(--ic-space-1px);background-color:var(--ic-architectural-400);border-radius:var(--ic-space-1px)}/*!@.divider.small*/.divider.small.sc-ic-date-input{height:var(--ic-space-md)}/*!@.divider.default*/.divider.default.sc-ic-date-input{height:calc(var(--ic-space-sm) + var(--ic-space-xs))}/*!@.divider.large*/.divider.large.sc-ic-date-input{height:var(--ic-space-lg)}";
+const icDateInputCss = "/*!@html*/html.sc-ic-date-input{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-date-input{margin:0}/*!@main*/main.sc-ic-date-input{display:block}/*!@h1*/h1.sc-ic-date-input{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-date-input{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-date-input{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-date-input{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-date-input{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-date-input,strong.sc-ic-date-input{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-date-input,kbd.sc-ic-date-input,samp.sc-ic-date-input{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-date-input{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-date-input,sup.sc-ic-date-input{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-date-input{bottom:-0.25em}/*!@sup*/sup.sc-ic-date-input{top:-0.5em}/*!@img*/img.sc-ic-date-input{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-date-input,input.sc-ic-date-input,optgroup.sc-ic-date-input,select.sc-ic-date-input,textarea.sc-ic-date-input{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-date-input,input.sc-ic-date-input{overflow:visible}/*!@button,\nselect*/button.sc-ic-date-input,select.sc-ic-date-input{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-date-input,[type=\"button\"].sc-ic-date-input,[type=\"reset\"].sc-ic-date-input,[type=\"submit\"].sc-ic-date-input{-webkit-appearance:button}/*!@button::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner*/button.sc-ic-date-input::-moz-focus-inner,[type=\"button\"].sc-ic-date-input::-moz-focus-inner,[type=\"reset\"].sc-ic-date-input::-moz-focus-inner,[type=\"submit\"].sc-ic-date-input::-moz-focus-inner{border-style:none;padding:0}/*!@button:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring*/button.sc-ic-date-input:-moz-focusring,[type=\"button\"].sc-ic-date-input:-moz-focusring,[type=\"reset\"].sc-ic-date-input:-moz-focusring,[type=\"submit\"].sc-ic-date-input:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-date-input{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-date-input{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-date-input{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-date-input{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-date-input,[type=\"radio\"].sc-ic-date-input{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-date-input::-webkit-inner-spin-button,[type=\"number\"].sc-ic-date-input::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-date-input{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-date-input::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-date-input::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-date-input{display:block}/*!@summary*/summary.sc-ic-date-input{display:list-item}/*!@template*/template.sc-ic-date-input{display:none}/*!@[hidden]*/[hidden].sc-ic-date-input{display:none}/*!@html,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo*/html.sc-ic-date-input,body.sc-ic-date-input,div.sc-ic-date-input,span.sc-ic-date-input,applet.sc-ic-date-input,object.sc-ic-date-input,iframe.sc-ic-date-input,h1.sc-ic-date-input,h2.sc-ic-date-input,h3.sc-ic-date-input,h4.sc-ic-date-input,h5.sc-ic-date-input,h6.sc-ic-date-input,p.sc-ic-date-input,blockquote.sc-ic-date-input,pre.sc-ic-date-input,a.sc-ic-date-input,abbr.sc-ic-date-input,acronym.sc-ic-date-input,address.sc-ic-date-input,big.sc-ic-date-input,cite.sc-ic-date-input,code.sc-ic-date-input,del.sc-ic-date-input,dfn.sc-ic-date-input,em.sc-ic-date-input,img.sc-ic-date-input,ins.sc-ic-date-input,kbd.sc-ic-date-input,q.sc-ic-date-input,s.sc-ic-date-input,samp.sc-ic-date-input,small.sc-ic-date-input,strike.sc-ic-date-input,strong.sc-ic-date-input,sub.sc-ic-date-input,sup.sc-ic-date-input,tt.sc-ic-date-input,var.sc-ic-date-input,b.sc-ic-date-input,u.sc-ic-date-input,i.sc-ic-date-input,center.sc-ic-date-input,dl.sc-ic-date-input,dt.sc-ic-date-input,dd.sc-ic-date-input,ol.sc-ic-date-input,ul.sc-ic-date-input,li.sc-ic-date-input,fieldset.sc-ic-date-input,form.sc-ic-date-input,label.sc-ic-date-input,legend.sc-ic-date-input,table.sc-ic-date-input,caption.sc-ic-date-input,tbody.sc-ic-date-input,tfoot.sc-ic-date-input,thead.sc-ic-date-input,tr.sc-ic-date-input,th.sc-ic-date-input,td.sc-ic-date-input,article.sc-ic-date-input,aside.sc-ic-date-input,canvas.sc-ic-date-input,details.sc-ic-date-input,embed.sc-ic-date-input,figure.sc-ic-date-input,figcaption.sc-ic-date-input,footer.sc-ic-date-input,header.sc-ic-date-input,hgroup.sc-ic-date-input,menu.sc-ic-date-input,nav.sc-ic-date-input,output.sc-ic-date-input,ruby.sc-ic-date-input,section.sc-ic-date-input,summary.sc-ic-date-input,time.sc-ic-date-input,mark.sc-ic-date-input,audio.sc-ic-date-input,video.sc-ic-date-input{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@input*/input.sc-ic-date-input{border:0;height:100%;padding:0;outline:none;background:none;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}/*!@input::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button*/input.sc-ic-date-input::-webkit-outer-spin-button,input.sc-ic-date-input::-webkit-inner-spin-button{-webkit-appearance:none}/*!@input:-webkit-autofill*/input.sc-ic-date-input:-webkit-autofill{box-shadow:0 0 0 var(--ic-space-sm) var(--ic-architectural-white) inset}/*!@ic-input-component-container*/ic-input-component-container.sc-ic-date-input{cursor:text}/*!@ic-input-component-container,\nic-input-component-container:hover*/ic-input-component-container.sc-ic-date-input,ic-input-component-container.sc-ic-date-input:hover{color:var(--ic-color-tertiary-text)}/*!@ic-input-component-container .focus-indicator*/ic-input-component-container.sc-ic-date-input .focus-indicator.sc-ic-date-input{padding:var(--ic-space-xxxs) var(--ic-space-xs);align-items:center}/*!@.day-input*/.day-input.sc-ic-date-input{width:1.438rem}/*!@.month-input*/.month-input.sc-ic-date-input{width:1.813rem}/*!@.year-input,\n.year-input.fit-to-value*/.year-input.sc-ic-date-input,.year-input.fit-to-value.sc-ic-date-input{width:2.313rem}/*!@.fit-to-value*/.fit-to-value.sc-ic-date-input{width:1.25rem}/*!@.sr-only*/.sr-only.sc-ic-date-input{position:absolute;left:-9999px}/*!@.input-container*/.input-container.sc-ic-date-input{width:100%;display:flex;justify-content:space-between;align-items:center;position:relative}/*!@.action-buttons*/.action-buttons.sc-ic-date-input{display:flex;align-items:center}/*!@.show-calendar-button-wrapper*/.show-calendar-button-wrapper.sc-ic-date-input{display:flex;justify-content:center;align-items:center}/*!@.clear-button,\n.calendar-button*/.clear-button.sc-ic-date-input,.calendar-button.sc-ic-date-input{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition);margin:0}/*!@.clear-button.hidden*/.clear-button.hidden.sc-ic-date-input{display:none}/*!@.clear-button:focus,\n.calendar-button:focus,\n.clear-button:active,\n.calendar-button:active*/.clear-button.sc-ic-date-input:focus,.calendar-button.sc-ic-date-input:focus,.clear-button.sc-ic-date-input:active,.calendar-button.sc-ic-date-input:active{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow) !important;border-radius:0.25rem}/*!@.clear-button:focus,\n.calendar-button:focus,\n.clear-button:active *,\n.calendar-button:active **/.clear-button.sc-ic-date-input:focus,.calendar-button.sc-ic-date-input:focus,.clear-button.sc-ic-date-input:active *.sc-ic-date-input,.calendar-button.sc-ic-date-input:active *.sc-ic-date-input{fill:var(--ic-architectural-white)}/*!@.divider*/.divider.sc-ic-date-input{margin:0 var(--ic-space-xxs);width:var(--ic-space-1px);background-color:var(--ic-architectural-400);border-radius:var(--ic-space-1px)}/*!@.divider.small*/.divider.small.sc-ic-date-input{height:var(--ic-space-md)}/*!@.divider.default*/.divider.default.sc-ic-date-input{height:calc(var(--ic-space-sm) + var(--ic-space-xs))}/*!@.divider.large*/.divider.large.sc-ic-date-input{height:var(--ic-space-lg)}";
 
 let inputIds$5 = 0;
 class DateInput {
@@ -12112,8 +12167,9 @@ class DateInput {
             this.notifyScreenReader(input, event);
         };
         this.handleKeyDown = (event, isInputPrevented) => {
+            var _a;
             const input = event.target;
-            const eventKey = event.key.toLowerCase();
+            const eventKey = (_a = event.key) === null || _a === void 0 ? void 0 : _a.toLowerCase();
             // Regex required due to FF allowing all characters as values for number text field.
             const regex = /-?\d*\.?\d+(e[-+]?\d+)?|[/-]|arrowup|arrowdown|arrowleft|arrowright|shift|tab|backspace|delete/;
             if (!regex.test(eventKey) &&
@@ -15202,6 +15258,7 @@ class HorizontalScroll {
         });
     }
     disconnectedCallback() {
+        var _a, _b;
         if (this.resizeObserver !== undefined) {
             this.resizeObserver.disconnect();
         }
@@ -15209,12 +15266,12 @@ class HorizontalScroll {
         ["mouseup", "mouseleave"].forEach((event) => {
             scrollArrows.forEach((arrow) => arrow.removeEventListener(event, this.arrowMouseUpHandler));
         });
-        this.items.forEach((item) => {
+        (_a = this.items) === null || _a === void 0 ? void 0 : _a.forEach((item) => {
             if (item.removeEventListener) {
                 item.removeEventListener(this.focusTrigger, this.focusHandler);
             }
         });
-        this.itemsContainerEl.removeEventListener("scroll", this.scrollHandler);
+        (_b = this.itemsContainerEl) === null || _b === void 0 ? void 0 : _b.removeEventListener("scroll", this.scrollHandler);
     }
     /**
      * @internal if side scrolling enabled, scrolls the specified item into view.
@@ -18071,11 +18128,12 @@ class Menu$1 {
         }
     }
     disconnectedCallback() {
+        var _a, _b;
         if (this.popperInstance) {
             this.popperInstance.destroy();
         }
-        this.parentEl.removeEventListener("icClear", this.handleClearListener);
-        this.parentEl.removeEventListener("icSubmitSearch", this.handleSubmitSearch);
+        (_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.removeEventListener("icClear", this.handleClearListener);
+        (_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.removeEventListener("icSubmitSearch", this.handleSubmitSearch);
     }
     componentWillLoad() {
         var _a, _b;
@@ -21043,7 +21101,7 @@ class MenuGroup {
     }
     render() {
         const parentMenu = this.el.closest("ic-popover-menu");
-        return (hAsync(Host, { "aria-label": this.label !== null ? this.label : "" }, isPropDefined$1(this.label) && (hAsync("ic-typography", { variant: "subtitle-small" }, this.label)), hAsync("ul", { role: "group" }, hAsync("slot", null)), this.el !== (parentMenu === null || parentMenu === void 0 ? void 0 : parentMenu.querySelector("ic-menu-group:last-child")) && (hAsync("hr", null))));
+        return (hAsync(Host, { role: "group", "aria-label": this.label !== null ? this.label : "" }, isPropDefined$1(this.label) && (hAsync("ic-typography", { variant: "subtitle-small" }, this.label)), hAsync("span", { class: "menu-items-wrapper" }, hAsync("slot", null)), this.el !== (parentMenu === null || parentMenu === void 0 ? void 0 : parentMenu.querySelector("ic-menu-group:last-child")) && (hAsync("hr", null))));
     }
     get el() { return getElement(this); }
     static get style() { return icMenuGroupCss; }
@@ -21069,6 +21127,7 @@ class MenuItem {
         registerInstance(this, hostRef);
         this.childBlur = createEvent(this, "childBlur", 7);
         this.handleMenuItemClick = createEvent(this, "handleMenuItemClick", 7);
+        this.icToggleChecked = createEvent(this, "icToggleChecked", 7);
         this.triggerPopoverMenuInstance = createEvent(this, "triggerPopoverMenuInstance", 7);
         this.handleClick = (e) => {
             if (isPropDefined$1(this.submenuTriggerFor)) {
@@ -21077,6 +21136,9 @@ class MenuItem {
             else if (this.variant === "toggle") {
                 e.preventDefault();
                 this.toggleChecked = !this.toggleChecked;
+                this.icToggleChecked.emit({
+                    checked: this.toggleChecked,
+                });
             }
             this.handleMenuItemClick.emit({
                 label: this.label,
@@ -21109,7 +21171,6 @@ class MenuItem {
                 return ariaLabel;
             }
         };
-        this.toggleChecked = false;
         this.description = undefined;
         this.disabled = false;
         this.href = undefined;
@@ -21120,6 +21181,7 @@ class MenuItem {
         this.rel = undefined;
         this.submenuTriggerFor = undefined;
         this.target = undefined;
+        this.toggleChecked = false;
         this.variant = "default";
     }
     componentWillLoad() {
@@ -21144,13 +21206,13 @@ class MenuItem {
         };
         return (hAsync(Host, { class: {
                 ["disabled"]: this.disabled,
-            } }, hAsync("li", { role: this.variant === "toggle" ? "menuitemcheckbox" : "menuitem", "aria-disabled": `${this.disabled}`, "aria-checked": this.variant === "toggle" ? this.toggleChecked : undefined }, hAsync("ic-button", { fullWidth: true, variant: "tertiary", onClick: this.handleClick, href: isPropDefined$1(this.href), hreflang: isPropDefined$1(this.hreflang), target: isPropDefined$1(this.target), rel: isPropDefined$1(this.rel), referrerpolicy: this.referrerpolicy !== undefined ? this.referrerpolicy : null, "aria-disabled": `${this.disabled}`, "aria-label": this.getMenuItemAriaLabel(), ariaControlsId: isPropDefined$1(this.submenuTriggerFor)
-                ? `ic-popover-submenu-${this.submenuTriggerFor}`
-                : false, "aria-haspopup": isPropDefined$1(this.submenuTriggerFor) ||
+            } }, hAsync("li", { role: this.variant === "toggle" ? "menuitemcheckbox" : "menuitem", "aria-disabled": `${this.disabled}`, "aria-checked": this.variant === "toggle"
+                ? this.toggleChecked
+                    ? "true"
+                    : "false"
+                : undefined }, hAsync("ic-button", { fullWidth: true, variant: "tertiary", onClick: this.handleClick, href: isPropDefined$1(this.href), hreflang: isPropDefined$1(this.hreflang), target: isPropDefined$1(this.target), rel: isPropDefined$1(this.rel), referrerpolicy: this.referrerpolicy !== undefined ? this.referrerpolicy : null, "aria-disabled": `${this.disabled}`, "aria-label": this.getMenuItemAriaLabel(), "aria-haspopup": isPropDefined$1(this.submenuTriggerFor) ||
                 this.el.classList.contains("ic-popover-submenu-back-button")
                 ? "menu"
-                : false, ariaOwnsId: isPropDefined$1(this.submenuTriggerFor)
-                ? `ic-popover-submenu-${this.submenuTriggerFor}`
                 : false }, hAsync("div", { class: "focus-border" }, isSlotUsed$1(this.el, "icon") && (hAsync("span", { class: "icon" }, hAsync("slot", { name: "icon" }))), hAsync(MenuItemInformation, null), this.variant === "toggle" && (hAsync("span", { class: {
                 ["check-icon"]: true,
                 ["hide"]: !this.toggleChecked,
@@ -21173,12 +21235,12 @@ class MenuItem {
             "rel": [1],
             "submenuTriggerFor": [1, "submenu-trigger-for"],
             "target": [1],
-            "variant": [1537],
-            "toggleChecked": [32]
+            "toggleChecked": [1540, "toggle-checked"],
+            "variant": [1537]
         },
         "$listeners$": [[2, "click", "handleHostClick"]],
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["variant", "variant"]]
+        "$attrsToReflect$": [["toggleChecked", "toggle-checked"], ["variant", "variant"]]
     }; }
 }
 
@@ -21515,11 +21577,12 @@ class NavigationGroup {
         this.label = undefined;
     }
     disconnectedCallback() {
+        var _a, _b;
         if (this.navigationType === "side") {
-            this.parentEl.removeEventListener("sideNavExpanded", this.sideNavExpandHandler);
+            (_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.removeEventListener("sideNavExpanded", this.sideNavExpandHandler);
         }
         else if (this.navigationType === "top") {
-            this.parentEl.removeEventListener("topNavResized", this.topNavResizedHandler);
+            (_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.removeEventListener("topNavResized", this.topNavResizedHandler);
         }
     }
     componentWillLoad() {
@@ -21638,12 +21701,14 @@ class NavigationItem {
         this.childBlur = createEvent(this, "childBlur", 7);
         this.navItemClicked = createEvent(this, "navItemClicked", 7);
         this.isInitialRender = true;
+        this.hostMutationObserver = null;
+        this.ARIA_LABEL_STRING = "aria-label";
         this.displayDefaultNavigationItem = (href, hreflang, target, rel, referrerpolicy, download, label) => {
             const variant = this.isTopNavChild || this.inTopNavSideMenu ? "body" : "label";
             const ChevronIconComponent = this.expandable && (hAsync("div", { class: { svg: true }, innerHTML: chevronIcon }));
             const IconComponent = this.el.querySelector('[slot="icon"]') && (hAsync("div", { class: "icon" }, hAsync("slot", { name: "icon" }), isSlotUsed$1(this.el, "badge") && hAsync("slot", { name: "badge" })));
             if (href !== "") {
-                return (hAsync("a", { href: href, target: target, rel: rel, hreflang: hreflang, referrerPolicy: referrerpolicy, download: download !== false ? download : null, class: "link", ref: (el) => (this.itemEl = el), part: "link" }, IconComponent, hAsync("ic-typography", { variant: variant }, label), hAsync("div", { class: "chevron-container" }, ChevronIconComponent), target === "_blank" && (hAsync("span", { class: "open-in-new-icon", innerHTML: OpenInNew }))));
+                return (hAsync("a", { href: href, target: target, rel: rel, hreflang: hreflang, referrerPolicy: referrerpolicy, download: download !== false ? download : null, class: "link", ref: (el) => (this.itemEl = el), part: "link", "aria-label": this.ariaLabel ? this.ariaLabel : null }, IconComponent, hAsync("ic-typography", { variant: variant }, label), hAsync("div", { class: "chevron-container" }, ChevronIconComponent), target === "_blank" && (hAsync("span", { class: "open-in-new-icon", innerHTML: OpenInNew }))));
             }
             return (hAsync("div", { tabindex: "0", class: "link", ref: (el) => (this.itemEl = el) }, IconComponent, hAsync("ic-typography", { variant: variant }, label), ChevronIconComponent));
         };
@@ -21671,6 +21736,14 @@ class NavigationItem {
         this.handleClick = () => {
             this.navItemClicked.emit();
         };
+        // triggered when attributes of host element change
+        this.hostMutationCallback = (mutationList) => {
+            mutationList.forEach(({ attributeName }) => {
+                if (attributeName === this.ARIA_LABEL_STRING) {
+                    this.ariaLabel = this.el.getAttribute(attributeName);
+                }
+            });
+        };
         this.generateTooltipLabel = () => {
             if (this.label) {
                 return this.label;
@@ -21700,6 +21773,7 @@ class NavigationItem {
         this.navigationType = undefined;
         this.parentEl = undefined;
         this.sideNavExpanded = false;
+        this.ariaLabel = "";
         this.collapsedIconLabel = false;
         this.displayNavigationTooltip = false;
         this.download = false;
@@ -21713,12 +21787,14 @@ class NavigationItem {
         this.target = undefined;
     }
     disconnectedCallback() {
+        var _a;
         if (this.navigationType === "side") {
             this.parentEl.removeEventListener("sideNavExpanded", this.sideNavExpandHandler);
         }
         else if (this.navigationType === "top") {
             this.parentEl.removeEventListener("topNavResized", this.topNavResizedHandler);
         }
+        (_a = this.hostMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     componentWillLoad() {
         const { navType, parent } = getNavItemParentDetails(this.el);
@@ -21740,6 +21816,15 @@ class NavigationItem {
         if (this.navigationSlot) {
             this.navigationSlot.ariaLabel = this.navigationSlot.textContent.trim();
         }
+        if (this.el.hasAttribute(this.ARIA_LABEL_STRING)) {
+            this.ariaLabel = this.el.getAttribute(this.ARIA_LABEL_STRING);
+        }
+    }
+    componentDidLoad() {
+        this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
+        this.hostMutationObserver.observe(this.el, {
+            attributes: true,
+        });
     }
     componentDidUpdate() {
         this.isInitialRender = false;
@@ -21809,6 +21894,7 @@ class NavigationItem {
             "navigationType": [32],
             "parentEl": [32],
             "sideNavExpanded": [32],
+            "ariaLabel": [32],
             "setFocus": [64]
         },
         "$listeners$": [[4, "themeChange", "themeChangeHandler"]],
@@ -22763,7 +22849,7 @@ class PopoverMenu {
                     this.popoverMenuEls.push(el);
                 }
                 else if (el.tagName === "IC-MENU-GROUP") {
-                    const groupSlotWrapper = el.shadowRoot.querySelector("ul");
+                    const groupSlotWrapper = el.shadowRoot.querySelector(".menu-items-wrapper");
                     const menuGroupElements = getSlotElements$1(groupSlotWrapper);
                     this.addMenuItems(menuGroupElements);
                 }
@@ -22945,10 +23031,10 @@ class PopoverMenu {
                 ? `ic-popover-submenu-${this.submenuId}`
                 : "", class: {
                 menu: true,
-            }, tabindex: open ? "0" : "-1" }, hAsync("div", { class: {
+            }, tabindex: open ? "0" : "-1" }, hAsync("span", { class: {
                 "opening-from-parent": this.openingFromParent,
                 "opening-from-child": this.openingFromChild,
-            } }, isPropDefined$1(this.submenuId) && (hAsync("div", null, hAsync("ic-menu-item", { class: "ic-popover-submenu-back-button", ref: (el) => (this.backButton = el), label: "Back", onClick: this.handleBackButtonClick, id: `ic-popover-submenu-back-button-${this.submenuLevel}` }, hAsync("svg", { slot: "icon", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "submenu-back-icon" }, hAsync("path", { d: "M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z", fill: "currentColor" }))), hAsync("ic-typography", { variant: "subtitle-small", class: "parent-label" }, this.parentLabel))), hAsync("ul", { class: "button", "aria-label": this.getMenuAriaLabel(), role: "menu" }, hAsync("slot", null))))));
+            } }, isPropDefined$1(this.submenuId) && (hAsync("span", null, hAsync("span", { role: "menu" }, hAsync("ic-menu-item", { class: "ic-popover-submenu-back-button", ref: (el) => (this.backButton = el), label: "Back", onClick: this.handleBackButtonClick, id: `ic-popover-submenu-back-button-${this.submenuLevel}` }, hAsync("svg", { slot: "icon", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "submenu-back-icon" }, hAsync("path", { d: "M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z", fill: "currentColor" })))), hAsync("ic-typography", { variant: "subtitle-small", class: "parent-label" }, this.parentLabel))), hAsync("ul", { class: "button", "aria-label": this.getMenuAriaLabel(), role: "menu" }, hAsync("slot", null))))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
@@ -25941,10 +26027,11 @@ class SideNavigation {
             onComponentRequiredPropUndefined$1([{ prop: this.appTitle, propName: "app-title" }], "Side Navigation");
     }
     disconnectedCallback() {
+        var _a;
         if (this.resizeObserver !== null) {
             this.resizeObserver.disconnect();
         }
-        this.el.removeEventListener("transitionend", this.transitionEndHandler);
+        (_a = this.el) === null || _a === void 0 ? void 0 : _a.removeEventListener("transitionend", this.transitionEndHandler);
     }
     themeChangeHandler({ detail }) {
         this.foregroundColor = detail.mode;
@@ -26886,7 +26973,8 @@ class TabContext {
         this.configureTabs();
     }
     disconnectedCallback() {
-        this.tabGroup.removeEventListener("keydown", this.keydownHandler);
+        var _a;
+        (_a = this.tabGroup) === null || _a === void 0 ? void 0 : _a.removeEventListener("keydown", this.keydownHandler);
     }
     tabClickHandler(event) {
         if (this.selectedTabIndex === undefined &&
@@ -27882,7 +27970,7 @@ class ToggleButtonGroup {
         });
     }
     disconnectedCallback() {
-        document.removeEventListener("keydown", this.keyListener);
+        document === null || document === void 0 ? void 0 : document.removeEventListener("keydown", this.keyListener);
     }
     // trigger selectHandler when unable to add 'target'
     proxySelectHandler(toggle) {
@@ -28517,7 +28605,9 @@ class TreeItem {
         }
         this.setTreeItemPadding();
         this.updateAriaLabel();
-        this.truncateTreeItemLabel(this.el);
+        setTimeout(() => {
+            this.truncateTreeItemLabel(this.el);
+        }, 100);
         !isSlotUsed(this.el, "label") &&
             onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Tree item");
         this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukic/canary-web-components",
-  "version": "2.0.0-canary.28",
+  "version": "2.0.0-canary.29",
   "description": "A web component UI library compiled with StencilJS",
   "main": "dist/index.cjs.js",
   "module": "./dist/index.js",
@@ -43,7 +43,7 @@
   "dependencies": {
     "@popperjs/core": "^2.11.2",
     "@stencil/core": "^4.9.0",
-    "@ukic/web-components": "^2.30.0"
+    "@ukic/web-components": "^2.31.0"
   },
   "peerDependencies": {
     "@ukic/fonts": "^2.3.0"
@@ -89,5 +89,5 @@
     "webpack": "^5.76.0"
   },
   "license": "MIT",
-  "gitHead": "895517389cf1b33e002f4b72661792fd74ee4cbb"
+  "gitHead": "8f1cf8223eb9c9d871cca4af42fc7c39db4f1b6a"
 }