@ukic/canary-web-components 2.0.0-canary.24 → 2.0.0-canary.25

Sign up to get free protection for your applications and to get access to all the features.
Files changed (134) hide show
  1. package/dist/cjs/core.cjs.js +1 -1
  2. package/dist/cjs/{helpers-85c5ca15.js → helpers-6817cfbb.js} +20 -31
  3. package/dist/cjs/helpers-6817cfbb.js.map +1 -0
  4. package/dist/cjs/ic-alert.cjs.entry.js +9 -4
  5. package/dist/cjs/ic-alert.cjs.entry.js.map +1 -1
  6. package/dist/cjs/ic-badge.cjs.entry.js +2 -2
  7. package/dist/cjs/ic-badge.cjs.entry.js.map +1 -1
  8. package/dist/cjs/ic-card-horizontal.cjs.entry.js +1 -1
  9. package/dist/cjs/ic-data-table-title-bar.cjs.entry.js +1 -1
  10. package/dist/cjs/ic-data-table.cjs.entry.js +200 -51
  11. package/dist/cjs/ic-data-table.cjs.entry.js.map +1 -1
  12. package/dist/cjs/ic-date-input.cjs.entry.js +3 -2
  13. package/dist/cjs/ic-date-input.cjs.entry.js.map +1 -1
  14. package/dist/cjs/ic-date-picker.cjs.entry.js +3 -1
  15. package/dist/cjs/ic-date-picker.cjs.entry.js.map +1 -1
  16. package/dist/cjs/ic-dialog.cjs.entry.js.map +1 -1
  17. package/dist/cjs/ic-empty-state_2.cjs.entry.js +1 -1
  18. package/dist/cjs/ic-menu-with-multi.cjs.entry.js +1 -1
  19. package/dist/cjs/ic-pagination_4.cjs.entry.js +2 -1
  20. package/dist/cjs/ic-pagination_4.cjs.entry.js.map +1 -1
  21. package/dist/cjs/ic-select-with-multi.cjs.entry.js +1 -1
  22. package/dist/cjs/ic-tree-item.cjs.entry.js +1 -1
  23. package/dist/cjs/ic-tree-view.cjs.entry.js +1 -1
  24. package/dist/cjs/loader.cjs.js +1 -1
  25. package/dist/collection/components/ic-data-table/ic-data-table.css +31 -7
  26. package/dist/collection/components/ic-data-table/ic-data-table.js +298 -56
  27. package/dist/collection/components/ic-data-table/ic-data-table.js.map +1 -1
  28. package/dist/collection/components/ic-data-table/ic-data-table.types.js.map +1 -1
  29. package/dist/collection/components/ic-data-table/story-data.js +143 -54
  30. package/dist/collection/components/ic-data-table/story-data.js.map +1 -1
  31. package/dist/collection/components/ic-date-input/ic-date-input.js +20 -1
  32. package/dist/collection/components/ic-date-input/ic-date-input.js.map +1 -1
  33. package/dist/collection/components/ic-date-input/test/basic/ic-date-input.spec.js +9 -0
  34. package/dist/collection/components/ic-date-input/test/basic/ic-date-input.spec.js.map +1 -1
  35. package/dist/collection/components/ic-date-picker/ic-date-picker.js +20 -0
  36. package/dist/collection/components/ic-date-picker/ic-date-picker.js.map +1 -1
  37. package/dist/collection/components/ic-date-picker/test/basic/ic-date-picker.spec.js +10 -0
  38. package/dist/collection/components/ic-date-picker/test/basic/ic-date-picker.spec.js.map +1 -1
  39. package/dist/collection/utils/helpers.js +22 -0
  40. package/dist/collection/utils/helpers.js.map +1 -1
  41. package/dist/components/helpers2.js +18 -29
  42. package/dist/components/helpers2.js.map +1 -1
  43. package/dist/components/ic-alert2.js +11 -5
  44. package/dist/components/ic-alert2.js.map +1 -1
  45. package/dist/components/ic-badge.js +2 -2
  46. package/dist/components/ic-badge.js.map +1 -1
  47. package/dist/components/ic-data-table.js +207 -52
  48. package/dist/components/ic-data-table.js.map +1 -1
  49. package/dist/components/ic-date-input2.js +3 -1
  50. package/dist/components/ic-date-input2.js.map +1 -1
  51. package/dist/components/ic-date-picker.js +3 -0
  52. package/dist/components/ic-date-picker.js.map +1 -1
  53. package/dist/components/ic-dialog.js.map +1 -1
  54. package/dist/components/ic-text-field2.js +3 -1
  55. package/dist/components/ic-text-field2.js.map +1 -1
  56. package/dist/core/core.esm.js +1 -1
  57. package/dist/core/core.esm.js.map +1 -1
  58. package/dist/core/{p-401d0c66.entry.js → p-20997691.entry.js} +2 -2
  59. package/dist/core/p-297e99cf.js +2 -0
  60. package/dist/core/p-297e99cf.js.map +1 -0
  61. package/dist/core/p-40e5fa80.entry.js +2 -0
  62. package/dist/core/p-40e5fa80.entry.js.map +1 -0
  63. package/dist/core/p-673a4a62.entry.js.map +1 -1
  64. package/dist/core/p-6af080d3.entry.js +2 -0
  65. package/dist/core/p-6af080d3.entry.js.map +1 -0
  66. package/dist/core/p-74abc3bb.entry.js +2 -0
  67. package/dist/core/p-74abc3bb.entry.js.map +1 -0
  68. package/dist/core/{p-4309460f.entry.js → p-80d6a6b5.entry.js} +2 -2
  69. package/dist/core/{p-06732eaf.entry.js → p-92f701e7.entry.js} +2 -2
  70. package/dist/core/{p-ec9edecf.entry.js → p-989310a8.entry.js} +2 -2
  71. package/dist/core/p-989310a8.entry.js.map +1 -0
  72. package/dist/core/{p-ede631c5.entry.js → p-9b34989b.entry.js} +2 -2
  73. package/dist/core/p-bd1f8741.entry.js +2 -0
  74. package/dist/core/p-bd1f8741.entry.js.map +1 -0
  75. package/dist/core/{p-57043b1e.entry.js → p-c6bdbe69.entry.js} +2 -2
  76. package/dist/core/{p-a052bb95.entry.js → p-c98ce508.entry.js} +2 -2
  77. package/dist/core/{p-b29e96b5.entry.js → p-d362992d.entry.js} +2 -2
  78. package/dist/core/{p-b97eba08.entry.js → p-ee8a3de6.entry.js} +2 -2
  79. package/dist/core/p-ee8a3de6.entry.js.map +1 -0
  80. package/dist/esm/core.js +1 -1
  81. package/dist/esm/{helpers-f543bc77.js → helpers-5bd2012a.js} +19 -30
  82. package/dist/esm/helpers-5bd2012a.js.map +1 -0
  83. package/dist/esm/ic-alert.entry.js +10 -5
  84. package/dist/esm/ic-alert.entry.js.map +1 -1
  85. package/dist/esm/ic-badge.entry.js +2 -2
  86. package/dist/esm/ic-badge.entry.js.map +1 -1
  87. package/dist/esm/ic-card-horizontal.entry.js +1 -1
  88. package/dist/esm/ic-data-table-title-bar.entry.js +1 -1
  89. package/dist/esm/ic-data-table.entry.js +201 -52
  90. package/dist/esm/ic-data-table.entry.js.map +1 -1
  91. package/dist/esm/ic-date-input.entry.js +3 -2
  92. package/dist/esm/ic-date-input.entry.js.map +1 -1
  93. package/dist/esm/ic-date-picker.entry.js +3 -1
  94. package/dist/esm/ic-date-picker.entry.js.map +1 -1
  95. package/dist/esm/ic-dialog.entry.js.map +1 -1
  96. package/dist/esm/ic-empty-state_2.entry.js +1 -1
  97. package/dist/esm/ic-menu-with-multi.entry.js +1 -1
  98. package/dist/esm/ic-pagination_4.entry.js +2 -1
  99. package/dist/esm/ic-pagination_4.entry.js.map +1 -1
  100. package/dist/esm/ic-select-with-multi.entry.js +1 -1
  101. package/dist/esm/ic-tree-item.entry.js +1 -1
  102. package/dist/esm/ic-tree-view.entry.js +1 -1
  103. package/dist/esm/loader.js +1 -1
  104. package/dist/types/components/ic-data-table/ic-data-table.d.ts +32 -9
  105. package/dist/types/components/ic-data-table/ic-data-table.types.d.ts +12 -4
  106. package/dist/types/components/ic-data-table/story-data.d.ts +69 -8
  107. package/dist/types/components/ic-date-input/ic-date-input.d.ts +4 -0
  108. package/dist/types/components/ic-date-picker/ic-date-picker.d.ts +4 -0
  109. package/dist/types/components.d.ts +62 -6
  110. package/dist/types/interface.d.ts +1 -0
  111. package/dist/types/utils/helpers.d.ts +6 -0
  112. package/hydrate/index.js +260 -102
  113. package/package.json +3 -3
  114. package/dist/cjs/helpers-85c5ca15.js.map +0 -1
  115. package/dist/core/p-1f9cb805.entry.js +0 -2
  116. package/dist/core/p-1f9cb805.entry.js.map +0 -1
  117. package/dist/core/p-3f2723aa.entry.js +0 -2
  118. package/dist/core/p-3f2723aa.entry.js.map +0 -1
  119. package/dist/core/p-59993f36.entry.js +0 -2
  120. package/dist/core/p-59993f36.entry.js.map +0 -1
  121. package/dist/core/p-91cf89c8.entry.js +0 -2
  122. package/dist/core/p-91cf89c8.entry.js.map +0 -1
  123. package/dist/core/p-adbe0d89.js +0 -2
  124. package/dist/core/p-adbe0d89.js.map +0 -1
  125. package/dist/core/p-b97eba08.entry.js.map +0 -1
  126. package/dist/core/p-ec9edecf.entry.js.map +0 -1
  127. package/dist/esm/helpers-f543bc77.js.map +0 -1
  128. /package/dist/core/{p-401d0c66.entry.js.map → p-20997691.entry.js.map} +0 -0
  129. /package/dist/core/{p-4309460f.entry.js.map → p-80d6a6b5.entry.js.map} +0 -0
  130. /package/dist/core/{p-06732eaf.entry.js.map → p-92f701e7.entry.js.map} +0 -0
  131. /package/dist/core/{p-ede631c5.entry.js.map → p-9b34989b.entry.js.map} +0 -0
  132. /package/dist/core/{p-57043b1e.entry.js.map → p-c6bdbe69.entry.js.map} +0 -0
  133. /package/dist/core/{p-a052bb95.entry.js.map → p-c98ce508.entry.js.map} +0 -0
  134. /package/dist/core/{p-b29e96b5.entry.js.map → p-d362992d.entry.js.map} +0 -0
package/hydrate/index.js CHANGED
@@ -7692,10 +7692,10 @@ const debounceEvent = (event, wait) => {
7692
7692
  const original = event._original || event;
7693
7693
  return {
7694
7694
  _original: event,
7695
- emit: debounce$3(original.emit.bind(original), wait),
7695
+ emit: debounce$2(original.emit.bind(original), wait),
7696
7696
  };
7697
7697
  };
7698
- const debounce$3 = (func, wait = 0) => {
7698
+ const debounce$2 = (func, wait = 0) => {
7699
7699
  let timer;
7700
7700
  return (...args) => {
7701
7701
  clearTimeout(timer);
@@ -7933,21 +7933,21 @@ const getThemeColorBrightness = () => {
7933
7933
  const getThemeForegroundColor = (brightness = getThemeColorBrightness()) => brightness > DARK_MODE_THRESHOLD
7934
7934
  ? IcThemeForegroundEnum$1.Dark
7935
7935
  : IcThemeForegroundEnum$1.Light;
7936
- const getSlot$1 = (element, name) => {
7936
+ const getSlot = (element, name) => {
7937
7937
  if (element && element.querySelector) {
7938
7938
  return element.querySelector(`[slot="${name}"]`);
7939
7939
  }
7940
7940
  return null;
7941
7941
  };
7942
- const slotHasContent = (element, name) => getSlot$1(element, name) !== null;
7943
- const getSlotContent$1 = (element, name) => {
7944
- const slot = getSlot$1(element, name);
7942
+ const slotHasContent = (element, name) => getSlot(element, name) !== null;
7943
+ const getSlotContent = (element, name) => {
7944
+ const slot = getSlot(element, name);
7945
7945
  if (slot) {
7946
- return getSlotElements$1(slot);
7946
+ return getSlotElements(slot);
7947
7947
  }
7948
7948
  return null;
7949
7949
  };
7950
- const getSlotElements$1 = (slot) => {
7950
+ const getSlotElements = (slot) => {
7951
7951
  const slotContent = slot.firstElementChild;
7952
7952
  if (slotContent !== null) {
7953
7953
  const elements = slotContent.assignedElements
@@ -8345,11 +8345,12 @@ var closeIcon = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fil
8345
8345
  </svg>
8346
8346
  `;
8347
8347
 
8348
- const icAlertCss = "/*!@html*/html.sc-ic-alert{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-alert{margin:0}/*!@main*/main.sc-ic-alert{display:block}/*!@h1*/h1.sc-ic-alert{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-alert{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-alert{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-alert{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-alert{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-alert,strong.sc-ic-alert{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-alert,kbd.sc-ic-alert,samp.sc-ic-alert{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-alert{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-alert,sup.sc-ic-alert{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-alert{bottom:-0.25em}/*!@sup*/sup.sc-ic-alert{top:-0.5em}/*!@img*/img.sc-ic-alert{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-alert,input.sc-ic-alert,optgroup.sc-ic-alert,select.sc-ic-alert,textarea.sc-ic-alert{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-alert,input.sc-ic-alert{overflow:visible}/*!@button,\nselect*/button.sc-ic-alert,select.sc-ic-alert{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-alert,[type=\"button\"].sc-ic-alert,[type=\"reset\"].sc-ic-alert,[type=\"submit\"].sc-ic-alert{-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-alert::-moz-focus-inner,[type=\"button\"].sc-ic-alert::-moz-focus-inner,[type=\"reset\"].sc-ic-alert::-moz-focus-inner,[type=\"submit\"].sc-ic-alert::-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-alert:-moz-focusring,[type=\"button\"].sc-ic-alert:-moz-focusring,[type=\"reset\"].sc-ic-alert:-moz-focusring,[type=\"submit\"].sc-ic-alert:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-alert{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-alert{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-alert{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-alert{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-alert,[type=\"radio\"].sc-ic-alert{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-alert::-webkit-inner-spin-button,[type=\"number\"].sc-ic-alert::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-alert{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-alert::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-alert::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-alert{display:block}/*!@summary*/summary.sc-ic-alert{display:list-item}/*!@template*/template.sc-ic-alert{display:none}/*!@[hidden]*/[hidden].sc-ic-alert{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-alert,body.sc-ic-alert,div.sc-ic-alert,span.sc-ic-alert,applet.sc-ic-alert,object.sc-ic-alert,iframe.sc-ic-alert,h1.sc-ic-alert,h2.sc-ic-alert,h3.sc-ic-alert,h4.sc-ic-alert,h5.sc-ic-alert,h6.sc-ic-alert,p.sc-ic-alert,blockquote.sc-ic-alert,pre.sc-ic-alert,a.sc-ic-alert,abbr.sc-ic-alert,acronym.sc-ic-alert,address.sc-ic-alert,big.sc-ic-alert,cite.sc-ic-alert,code.sc-ic-alert,del.sc-ic-alert,dfn.sc-ic-alert,em.sc-ic-alert,img.sc-ic-alert,ins.sc-ic-alert,kbd.sc-ic-alert,q.sc-ic-alert,s.sc-ic-alert,samp.sc-ic-alert,small.sc-ic-alert,strike.sc-ic-alert,strong.sc-ic-alert,sub.sc-ic-alert,sup.sc-ic-alert,tt.sc-ic-alert,var.sc-ic-alert,b.sc-ic-alert,u.sc-ic-alert,i.sc-ic-alert,center.sc-ic-alert,dl.sc-ic-alert,dt.sc-ic-alert,dd.sc-ic-alert,ol.sc-ic-alert,ul.sc-ic-alert,li.sc-ic-alert,fieldset.sc-ic-alert,form.sc-ic-alert,label.sc-ic-alert,legend.sc-ic-alert,table.sc-ic-alert,caption.sc-ic-alert,tbody.sc-ic-alert,tfoot.sc-ic-alert,thead.sc-ic-alert,tr.sc-ic-alert,th.sc-ic-alert,td.sc-ic-alert,article.sc-ic-alert,aside.sc-ic-alert,canvas.sc-ic-alert,details.sc-ic-alert,embed.sc-ic-alert,figure.sc-ic-alert,figcaption.sc-ic-alert,footer.sc-ic-alert,header.sc-ic-alert,hgroup.sc-ic-alert,menu.sc-ic-alert,nav.sc-ic-alert,output.sc-ic-alert,ruby.sc-ic-alert,section.sc-ic-alert,summary.sc-ic-alert,time.sc-ic-alert,mark.sc-ic-alert,audio.sc-ic-alert,video.sc-ic-alert{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@:host*/.sc-ic-alert-h{display:block}/*!@.container*/.container.sc-ic-alert{min-height:3.5rem;border-radius:var(--ic-border-radius);position:relative;display:flex;align-items:center}/*!@.container-neutral*/.container-neutral.sc-ic-alert{background-color:var(--ic-status-unknown-light)}/*!@.container-info*/.container-info.sc-ic-alert{background-color:var(--ic-status-info-light)}/*!@.container-warning*/.container-warning.sc-ic-alert{background-color:var(--ic-status-warning-light)}/*!@.container-error*/.container-error.sc-ic-alert{background-color:var(--ic-status-error-light)}/*!@.container-success*/.container-success.sc-ic-alert{background-color:var(--ic-status-success-light)}/*!@.alert-icon-container*/.alert-icon-container.sc-ic-alert{height:100%;display:flex;align-items:center}/*!@.divider*/.divider.sc-ic-alert{height:100%;width:var(--ic-space-xs);border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);position:absolute}/*!@.divider-neutral*/.divider-neutral.sc-ic-alert{background-color:var(--ic-status-unknown)}/*!@.divider-info*/.divider-info.sc-ic-alert{background-color:var(--ic-status-info)}/*!@.divider-warning*/.divider-warning.sc-ic-alert{background-color:var(--ic-status-warning)}/*!@.divider-error*/.divider-error.sc-ic-alert{background-color:var(--ic-status-error)}/*!@.divider-success*/.divider-success.sc-ic-alert{background-color:var(--ic-status-success)}/*!@.alert-icon*/.alert-icon.sc-ic-alert{height:var(--ic-space-lg);width:1.375rem;margin-left:1.125rem}/*!@.alert-icon > svg*/.alert-icon.sc-ic-alert>svg.sc-ic-alert{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}/*!@.icon-neutral > svg*/.icon-neutral.sc-ic-alert>svg.sc-ic-alert{fill:var(--ic-status-unknown)}/*!@:host([variant=\"info\"]) .alert-icon svg*/[variant=\"info\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-info)}/*!@:host([variant=\"warning\"]) .alert-icon svg*/[variant=\"warning\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-warning)}/*!@:host([variant=\"error\"]) .alert-icon svg*/[variant=\"error\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-error)}/*!@:host([variant=\"success\"]) .alert-icon svg*/[variant=\"success\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-success)}/*!@.alert-content*/.alert-content.sc-ic-alert{display:flex;align-items:center;margin-left:0.625rem;width:100%}/*!@.alert-message*/.alert-message.sc-ic-alert{display:flex;align-items:center;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;flex:1}/*!@.alert-message-title-above*/.alert-message-title-above.sc-ic-alert{display:inline}/*!@.alert-title*/.alert-title.sc-ic-alert{margin-right:var(--ic-space-xs)}/*!@.alert-title-above*/.alert-title-above.sc-ic-alert{white-space:normal}/*!@.alert-action-container*/.alert-action-container.sc-ic-alert{margin-right:var(--ic-space-xs);display:flex;align-items:center}/*!@.dismiss-icon*/.dismiss-icon.sc-ic-alert{margin-right:var(--ic-space-xxxs);margin-left:-0.375rem;padding:0.375rem;border:none;border-radius:50%;background-color:inherit;display:flex;align-items:center;justify-content:center}/*!@.dismiss-icon:hover*/.dismiss-icon.sc-ic-alert:hover{cursor:pointer}@media (max-width: 628px){/*!@.alert-content*/.alert-content.sc-ic-alert{display:flex;flex-direction:column;align-items:flex-start}/*!@.alert-message*/.alert-message.sc-ic-alert{display:flex;flex-direction:column;align-items:flex-start}/*!@.alert-title*/.alert-title.sc-ic-alert{white-space:normal}/*!@.alert-action-container*/.alert-action-container.sc-ic-alert{margin-bottom:var(--ic-space-xs)}}@media (forced-colors: active){/*!@.container*/.container.sc-ic-alert{border:var(--ic-hc-border)}}";
8348
+ const icAlertCss = "/*!@html*/html.sc-ic-alert{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-alert{margin:0}/*!@main*/main.sc-ic-alert{display:block}/*!@h1*/h1.sc-ic-alert{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-alert{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-alert{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-alert{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-alert{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-alert,strong.sc-ic-alert{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-alert,kbd.sc-ic-alert,samp.sc-ic-alert{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-alert{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-alert,sup.sc-ic-alert{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-alert{bottom:-0.25em}/*!@sup*/sup.sc-ic-alert{top:-0.5em}/*!@img*/img.sc-ic-alert{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-alert,input.sc-ic-alert,optgroup.sc-ic-alert,select.sc-ic-alert,textarea.sc-ic-alert{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-alert,input.sc-ic-alert{overflow:visible}/*!@button,\nselect*/button.sc-ic-alert,select.sc-ic-alert{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-alert,[type=\"button\"].sc-ic-alert,[type=\"reset\"].sc-ic-alert,[type=\"submit\"].sc-ic-alert{-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-alert::-moz-focus-inner,[type=\"button\"].sc-ic-alert::-moz-focus-inner,[type=\"reset\"].sc-ic-alert::-moz-focus-inner,[type=\"submit\"].sc-ic-alert::-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-alert:-moz-focusring,[type=\"button\"].sc-ic-alert:-moz-focusring,[type=\"reset\"].sc-ic-alert:-moz-focusring,[type=\"submit\"].sc-ic-alert:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-alert{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-alert{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-alert{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-alert{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-alert,[type=\"radio\"].sc-ic-alert{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-alert::-webkit-inner-spin-button,[type=\"number\"].sc-ic-alert::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-alert{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-alert::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-alert::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-alert{display:block}/*!@summary*/summary.sc-ic-alert{display:list-item}/*!@template*/template.sc-ic-alert{display:none}/*!@[hidden]*/[hidden].sc-ic-alert{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-alert,body.sc-ic-alert,div.sc-ic-alert,span.sc-ic-alert,applet.sc-ic-alert,object.sc-ic-alert,iframe.sc-ic-alert,h1.sc-ic-alert,h2.sc-ic-alert,h3.sc-ic-alert,h4.sc-ic-alert,h5.sc-ic-alert,h6.sc-ic-alert,p.sc-ic-alert,blockquote.sc-ic-alert,pre.sc-ic-alert,a.sc-ic-alert,abbr.sc-ic-alert,acronym.sc-ic-alert,address.sc-ic-alert,big.sc-ic-alert,cite.sc-ic-alert,code.sc-ic-alert,del.sc-ic-alert,dfn.sc-ic-alert,em.sc-ic-alert,img.sc-ic-alert,ins.sc-ic-alert,kbd.sc-ic-alert,q.sc-ic-alert,s.sc-ic-alert,samp.sc-ic-alert,small.sc-ic-alert,strike.sc-ic-alert,strong.sc-ic-alert,sub.sc-ic-alert,sup.sc-ic-alert,tt.sc-ic-alert,var.sc-ic-alert,b.sc-ic-alert,u.sc-ic-alert,i.sc-ic-alert,center.sc-ic-alert,dl.sc-ic-alert,dt.sc-ic-alert,dd.sc-ic-alert,ol.sc-ic-alert,ul.sc-ic-alert,li.sc-ic-alert,fieldset.sc-ic-alert,form.sc-ic-alert,label.sc-ic-alert,legend.sc-ic-alert,table.sc-ic-alert,caption.sc-ic-alert,tbody.sc-ic-alert,tfoot.sc-ic-alert,thead.sc-ic-alert,tr.sc-ic-alert,th.sc-ic-alert,td.sc-ic-alert,article.sc-ic-alert,aside.sc-ic-alert,canvas.sc-ic-alert,details.sc-ic-alert,embed.sc-ic-alert,figure.sc-ic-alert,figcaption.sc-ic-alert,footer.sc-ic-alert,header.sc-ic-alert,hgroup.sc-ic-alert,menu.sc-ic-alert,nav.sc-ic-alert,output.sc-ic-alert,ruby.sc-ic-alert,section.sc-ic-alert,summary.sc-ic-alert,time.sc-ic-alert,mark.sc-ic-alert,audio.sc-ic-alert,video.sc-ic-alert{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@:host*/.sc-ic-alert-h{display:block}/*!@.container*/.container.sc-ic-alert{min-height:3.5rem;border-radius:var(--ic-border-radius);position:relative;display:flex;align-items:center}/*!@.container-neutral*/.container-neutral.sc-ic-alert{background-color:var(--ic-status-unknown-light)}/*!@.container-info*/.container-info.sc-ic-alert{background-color:var(--ic-status-info-light)}/*!@.container-warning*/.container-warning.sc-ic-alert{background-color:var(--ic-status-warning-light)}/*!@.container-error*/.container-error.sc-ic-alert{background-color:var(--ic-status-error-light)}/*!@.container-success*/.container-success.sc-ic-alert{background-color:var(--ic-status-success-light)}/*!@.alert-icon-container*/.alert-icon-container.sc-ic-alert{height:100%;display:flex;align-items:center}/*!@.divider*/.divider.sc-ic-alert{height:100%;width:var(--ic-space-xs);border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);position:absolute}/*!@.divider-neutral*/.divider-neutral.sc-ic-alert{background-color:var(--ic-status-unknown)}/*!@.divider-info*/.divider-info.sc-ic-alert{background-color:var(--ic-status-info)}/*!@.divider-warning*/.divider-warning.sc-ic-alert{background-color:var(--ic-status-warning)}/*!@.divider-error*/.divider-error.sc-ic-alert{background-color:var(--ic-status-error)}/*!@.divider-success*/.divider-success.sc-ic-alert{background-color:var(--ic-status-success)}/*!@.alert-icon*/.alert-icon.sc-ic-alert{height:var(--ic-space-lg);width:1.375rem;margin-left:1.125rem}/*!@.icon-placeholder*/.icon-placeholder.sc-ic-alert{margin-left:var(--ic-space-xs)}/*!@.alert-icon > svg*/.alert-icon.sc-ic-alert>svg.sc-ic-alert{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}/*!@.icon-neutral > svg,\n::slotted(svg)*/.icon-neutral.sc-ic-alert>svg.sc-ic-alert,.sc-ic-alert-s>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block;fill:var(--ic-status-unknown)}/*!@:host([variant=\"info\"]) .alert-icon svg*/[variant=\"info\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-info)}/*!@:host([variant=\"warning\"]) .alert-icon svg*/[variant=\"warning\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-warning)}/*!@:host([variant=\"error\"]) .alert-icon svg*/[variant=\"error\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-error)}/*!@:host([variant=\"success\"]) .alert-icon svg*/[variant=\"success\"].sc-ic-alert-h .alert-icon.sc-ic-alert svg.sc-ic-alert{fill:var(--ic-status-success)}/*!@.alert-content*/.alert-content.sc-ic-alert{display:flex;align-items:center;margin-left:0.625rem;width:100%}/*!@.alert-message*/.alert-message.sc-ic-alert{display:flex;align-items:center;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;flex:1}/*!@.alert-message-title-above*/.alert-message-title-above.sc-ic-alert{display:inline}/*!@.alert-title*/.alert-title.sc-ic-alert{margin-right:var(--ic-space-xs)}/*!@.alert-title-above*/.alert-title-above.sc-ic-alert{white-space:normal}/*!@.alert-action-container*/.alert-action-container.sc-ic-alert{margin-right:var(--ic-space-xs);display:flex;align-items:center}/*!@.dismiss-icon*/.dismiss-icon.sc-ic-alert{margin-right:var(--ic-space-xxxs);margin-left:-0.375rem;padding:0.375rem;border:none;border-radius:50%;background-color:inherit;display:flex;align-items:center;justify-content:center}/*!@.dismiss-icon:hover*/.dismiss-icon.sc-ic-alert:hover{cursor:pointer}@media (max-width: 628px){/*!@.alert-content*/.alert-content.sc-ic-alert{display:flex;flex-direction:column;align-items:flex-start}/*!@.alert-message*/.alert-message.sc-ic-alert{display:flex;flex-direction:column;align-items:flex-start}/*!@.alert-title*/.alert-title.sc-ic-alert{white-space:normal}/*!@.alert-action-container*/.alert-action-container.sc-ic-alert{margin-bottom:var(--ic-space-xs)}}@media (forced-colors: active){/*!@.container*/.container.sc-ic-alert{border:var(--ic-hc-border)}}";
8349
8349
 
8350
8350
  /**
8351
8351
  * @slot message - Content is placed to the right of the title.
8352
8352
  * @slot action - Content is placed to the right of the message.
8353
+ * @slot neutral-icon - A custom neutral icon is placed to the left of the title. This will override the default icon if used.
8353
8354
  */
8354
8355
  class Alert {
8355
8356
  constructor(hostRef) {
@@ -8374,6 +8375,7 @@ class Alert {
8374
8375
  this.message = undefined;
8375
8376
  this.titleAbove = false;
8376
8377
  this.variant = "neutral";
8378
+ this.showDefaultIcon = true;
8377
8379
  }
8378
8380
  disconnectedCallback() {
8379
8381
  var _a;
@@ -8396,7 +8398,7 @@ class Alert {
8396
8398
  this.alertTitleWrap = true;
8397
8399
  }
8398
8400
  render() {
8399
- const { variant, heading, message, titleAbove, dismissible, announced, visible, } = this;
8401
+ const { variant, heading, message, titleAbove, dismissible, announced, visible, showDefaultIcon, } = this;
8400
8402
  return (visible && (hAsync(Host, { role: announced ? "alert" : null, class: {
8401
8403
  [IcThemeForegroundEnum$1.Dark]: true,
8402
8404
  } }, hAsync("div", { class: {
@@ -8405,11 +8407,15 @@ class Alert {
8405
8407
  } }, hAsync("div", { class: "alert-icon-container" }, hAsync("div", { class: {
8406
8408
  ["divider"]: true,
8407
8409
  [`divider-${variant}`]: true,
8408
- } }), hAsync("span", { class: {
8410
+ } }), variant === "neutral" ? (isSlotUsed$1(this.el, "neutral-icon") ? (hAsync("div", { class: "alert-icon svg-container icon-neutral" }, hAsync("slot", { name: "neutral-icon" }))) : showDefaultIcon ? (hAsync("span", { class: {
8411
+ ["alert-icon"]: true,
8412
+ ["svg-container"]: true,
8413
+ [`icon-${variant}`]: true,
8414
+ }, innerHTML: VARIANT_ICONS[variant].icon })) : (hAsync("div", { class: "icon-placeholder" }))) : (hAsync("span", { class: {
8409
8415
  ["alert-icon"]: true,
8410
8416
  ["svg-container"]: true,
8411
8417
  [`icon-${variant}`]: true,
8412
- }, innerHTML: VARIANT_ICONS[variant].icon })), hAsync("div", { class: "alert-content" }, hAsync("div", { class: {
8418
+ }, innerHTML: VARIANT_ICONS[variant].icon }))), hAsync("div", { class: "alert-content" }, hAsync("div", { class: {
8413
8419
  ["alert-message"]: true,
8414
8420
  ["alert-message-title-above"]: titleAbove || this.alertTitleWrap,
8415
8421
  } }, heading && (hAsync("ic-typography", { class: {
@@ -8432,6 +8438,7 @@ class Alert {
8432
8438
  "message": [1],
8433
8439
  "titleAbove": [4, "title-above"],
8434
8440
  "variant": [1],
8441
+ "showDefaultIcon": [4, "show-default-icon"],
8435
8442
  "alertTitleWrap": [32],
8436
8443
  "visible": [32]
8437
8444
  },
@@ -8598,7 +8605,7 @@ class BackToTop {
8598
8605
  }; }
8599
8606
  }
8600
8607
 
8601
- const icBadgeCss = "@media (prefers-reduced-motion: no-preference){/*!@:host(.show)*/.show.sc-ic-badge-h{animation:expand var(--ic-transition-duration-slow)}/*!@:host(.hide)*/.hide.sc-ic-badge-h{animation:shrink var(--ic-transition-duration-slow)}}/*!@:host*/.sc-ic-badge-h{display:flex;height:var(--ic-space-md);min-width:var(--ic-space-md);width:-moz-fit-content;width:fit-content;border-radius:calc(2 * var(--ic-space-xxl));position:absolute}/*!@:host(.neutral)*/.neutral.sc-ic-badge-h{background-color:var(--ic-architectural-500)}/*!@:host(.light)*/.light.sc-ic-badge-h{background-color:var(--ic-architectural-40)}/*!@:host(.info)*/.info.sc-ic-badge-h{background-color:var(--ic-status-info)}/*!@:host(.warning)*/.warning.sc-ic-badge-h{background-color:var(--ic-status-warning-mid)}/*!@:host(.error)*/.error.sc-ic-badge-h{background-color:var(--ic-status-error)}/*!@:host(.success)*/.success.sc-ic-badge-h{background-color:var(--ic-status-success)}/*!@:host(.small)*/.small.sc-ic-badge-h{height:var(--ic-space-sm);min-width:var(--ic-space-sm)}/*!@:host(.large)*/.large.sc-ic-badge-h{height:calc(var(--ic-space-md) + var(--ic-space-xxs));min-width:calc(var(--ic-space-md) + var(--ic-space-xxs))}/*!@:host(.dot.default)*/.dot.default.sc-ic-badge-h{height:var(--ic-space-xs);width:var(--ic-space-xs);min-width:var(--ic-space-xs)}/*!@:host(.dot.small)*/.dot.small.sc-ic-badge-h{height:calc(var(--ic-space-xxs) + var(--ic-space-xxxs));width:calc(var(--ic-space-xxs) + var(--ic-space-xxxs));min-width:calc(var(--ic-space-xxs) + var(--ic-space-xxxs))}/*!@:host(.dot.large)*/.dot.large.sc-ic-badge-h{height:var(--ic-space-sm);width:var(--ic-space-sm);min-width:var(--ic-space-sm)}/*!@:host(.foreground-dark) ::slotted(*)*/.sc-ic-badge-h.foreground-dark .sc-ic-badge-s>*{fill:var(--ic-color-primary-text)}/*!@:host(.foreground-light) ::slotted(*)*/.sc-ic-badge-h.foreground-light .sc-ic-badge-s>*{fill:white}/*!@:host(.foreground-dark) ic-typography*/.foreground-dark.sc-ic-badge-h ic-typography.sc-ic-badge{color:var(--ic-color-primary-text)}/*!@:host(.foreground-light) ic-typography*/.foreground-light.sc-ic-badge-h ic-typography.sc-ic-badge{color:white}/*!@:host(.text) ic-typography*/.text.sc-ic-badge-h ic-typography.sc-ic-badge{align-self:center;padding:0 calc((var(--ic-space-xs) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px)}/*!@:host(.text.small) ic-typography*/.text.small.sc-ic-badge-h ic-typography.sc-ic-badge{padding:0 0.2132rem}/*!@:host(.text.large) ic-typography*/.text.large.sc-ic-badge-h ic-typography.sc-ic-badge{padding:0 calc((var(--ic-space-sm) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px)}/*!@:host(.icon) ::slotted(svg)*/.sc-ic-badge-h.icon .sc-ic-badge-s>svg{width:var(--ic-space-sm);height:var(--ic-space-sm);padding:var(--ic-space-xxxs)}/*!@:host(.icon.small) ::slotted(svg)*/.sc-ic-badge-h.icon.small .sc-ic-badge-s>svg{width:var(--ic-space-xs);height:var(--ic-space-xs)}/*!@:host(.icon.large) ::slotted(svg)*/.sc-ic-badge-h.icon.large .sc-ic-badge-s>svg{width:calc(var(--ic-space-sm) + var(--ic-space-xxxs));height:calc(var(--ic-space-sm) + var(--ic-space-xxxs));padding:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}/*!@:host(.far)*/.far.sc-ic-badge-h{top:calc(-1 * var(--ic-space-xs));right:calc(-1 * var(--ic-space-xs))}/*!@:host(.far.small),\n:host(.dot.far.large)*/.far.small.sc-ic-badge-h,.dot.far.large.sc-ic-badge-h{top:calc(-1 * var(--ic-space-xxs));right:calc(-1 * var(--ic-space-xxs))}/*!@:host(.dot.far),\n:host(.dot.far.small)*/.dot.far.sc-ic-badge-h,.dot.far.small.sc-ic-badge-h{top:calc(-1 * var(--ic-space-xxxs));right:calc(-1 * var(--ic-space-xxxs))}/*!@:host(.near)*/.near.sc-ic-badge-h{top:calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)));right:calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)))}/*!@:host(.dot.near)*/.dot.near.sc-ic-badge-h{top:calc(-1 * var(--ic-space-1px));right:calc(-1 * var(--ic-space-1px))}/*!@:host(.inline)*/.inline.sc-ic-badge-h{position:static}/*!@:host(.hide)*/.hide.sc-ic-badge-h{visibility:hidden !important;transition:visibility var(--ic-transition-duration-slow)}@keyframes expand{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes shrink{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}";
8608
+ const icBadgeCss = "@media (prefers-reduced-motion: no-preference){/*!@:host(.show)*/.show.sc-ic-badge-h{animation:expand var(--ic-transition-duration-slow)}/*!@:host(.hide)*/.hide.sc-ic-badge-h{animation:shrink var(--ic-transition-duration-slow)}}/*!@:host*/.sc-ic-badge-h{display:flex;height:var(--ic-space-md);min-width:var(--ic-space-md);width:-moz-fit-content;width:fit-content;border-radius:calc(2 * var(--ic-space-xxl));position:absolute}/*!@:host(.neutral)*/.neutral.sc-ic-badge-h{background-color:var(--ic-architectural-500)}/*!@:host(.light)*/.light.sc-ic-badge-h{background-color:var(--ic-architectural-40)}/*!@:host(.info)*/.info.sc-ic-badge-h{background-color:var(--ic-status-info)}/*!@:host(.warning)*/.warning.sc-ic-badge-h{background-color:var(--ic-status-warning-mid)}/*!@:host(.error)*/.error.sc-ic-badge-h{background-color:var(--ic-status-error)}/*!@:host(.success)*/.success.sc-ic-badge-h{background-color:var(--ic-status-success)}/*!@:host(.small)*/.small.sc-ic-badge-h{height:var(--ic-space-sm);min-width:var(--ic-space-sm)}/*!@:host(.large)*/.large.sc-ic-badge-h{height:calc(var(--ic-space-md) + var(--ic-space-xxs));min-width:calc(var(--ic-space-md) + var(--ic-space-xxs))}/*!@:host(.dot.default)*/.dot.default.sc-ic-badge-h{height:var(--ic-space-xs);width:var(--ic-space-xs);min-width:var(--ic-space-xs)}/*!@:host(.dot.small)*/.dot.small.sc-ic-badge-h{height:calc(var(--ic-space-xxs) + var(--ic-space-xxxs));width:calc(var(--ic-space-xxs) + var(--ic-space-xxxs));min-width:calc(var(--ic-space-xxs) + var(--ic-space-xxxs))}/*!@:host(.dot.large)*/.dot.large.sc-ic-badge-h{height:var(--ic-space-sm);width:var(--ic-space-sm);min-width:var(--ic-space-sm)}/*!@:host(.foreground-dark) ::slotted(*)*/.sc-ic-badge-h.foreground-dark .sc-ic-badge-s>*{fill:var(--ic-color-primary-text)}/*!@:host(.foreground-light) ::slotted(*)*/.sc-ic-badge-h.foreground-light .sc-ic-badge-s>*{fill:white}/*!@:host(.foreground-dark) ic-typography*/.foreground-dark.sc-ic-badge-h ic-typography.sc-ic-badge{color:var(--ic-color-primary-text)}/*!@:host(.foreground-light) ic-typography*/.foreground-light.sc-ic-badge-h ic-typography.sc-ic-badge{color:white}/*!@:host(.text) ic-typography*/.text.sc-ic-badge-h ic-typography.sc-ic-badge{align-self:center;padding:0 calc((var(--ic-space-xs) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px)}/*!@:host(.text.small) ic-typography*/.text.small.sc-ic-badge-h ic-typography.sc-ic-badge{padding:0 0.2132rem}/*!@:host(.text.large) ic-typography*/.text.large.sc-ic-badge-h ic-typography.sc-ic-badge{padding:0 calc((var(--ic-space-sm) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px)}/*!@:host(.icon) ::slotted(svg)*/.sc-ic-badge-h.icon .sc-ic-badge-s>svg{width:var(--ic-space-sm);height:var(--ic-space-sm);padding:var(--ic-space-xxxs)}/*!@:host(.icon.small) ::slotted(svg)*/.sc-ic-badge-h.icon.small .sc-ic-badge-s>svg{width:var(--ic-space-xs);height:var(--ic-space-xs)}/*!@:host(.icon.large) ::slotted(svg)*/.sc-ic-badge-h.icon.large .sc-ic-badge-s>svg{width:calc(var(--ic-space-sm) + var(--ic-space-xxxs));height:calc(var(--ic-space-sm) + var(--ic-space-xxxs));padding:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}/*!@:host(.far)*/.far.sc-ic-badge-h{top:calc(-1 * var(--ic-space-xs));right:calc(-1 * var(--ic-space-xs))}/*!@:host(.far.small),\n:host(.dot.far.large)*/.far.small.sc-ic-badge-h,.dot.far.large.sc-ic-badge-h{top:calc(-1 * var(--ic-space-xxs));right:calc(-1 * var(--ic-space-xxs))}/*!@:host(.dot.far),\n:host(.dot.far.small)*/.dot.far.sc-ic-badge-h,.dot.far.small.sc-ic-badge-h{top:calc(-1 * var(--ic-space-xxxs));right:calc(-1 * var(--ic-space-xxxs))}/*!@:host(.near)*/.near.sc-ic-badge-h{top:calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)));right:calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)))}/*!@:host(.dot.near)*/.dot.near.sc-ic-badge-h{top:calc(-1 * var(--ic-space-1px));right:calc(-1 * var(--ic-space-1px))}/*!@:host(.inline)*/.inline.sc-ic-badge-h{position:static}/*!@:host(.hide)*/.hide.sc-ic-badge-h{visibility:hidden !important;transition:visibility var(--ic-transition-duration-slow)}/*!@.sr-only*/.sr-only.sc-ic-badge{position:absolute;left:-9999px}@keyframes expand{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes shrink{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}";
8602
8609
 
8603
8610
  /**
8604
8611
  * @slot badge-icon - Icon will be rendered inside the badge if type is set to icon.
@@ -8717,7 +8724,7 @@ class Badge {
8717
8724
  [`${type}`]: true,
8718
8725
  [`foreground-${foregroundColour}`]: foregroundColour !== null,
8719
8726
  [`${visible ? "show" : "hide"}`]: true,
8720
- }, id: el.id || null, "aria-label": ariaLabel, role: "status" }, type === "icon" && hAsync("slot", { name: "badge-icon" }), type === "text" && textLabel && (hAsync("ic-typography", { variant: size === "small" ? "badge-small" : "badge" }, getTextLabel()))));
8727
+ }, id: el.id || null, "aria-label": ariaLabel, role: "status" }, type === "icon" && hAsync("slot", { name: "badge-icon" }), type === "text" && textLabel && (hAsync("ic-typography", { variant: size === "small" ? "badge-small" : "badge" }, getTextLabel())), type === "dot" && hAsync("span", { class: "sr-only" }, "badge")));
8721
8728
  }
8722
8729
  static get delegatesFocus() { return true; }
8723
8730
  get el() { return getElement(this); }
@@ -9711,11 +9718,12 @@ const inheritAttributes = (element, attributes = []) => {
9711
9718
  });
9712
9719
  return attributeObject;
9713
9720
  };
9714
- const debounce$2 = (func, wait = 0) => {
9721
+ const dynamicDebounce = (func, getDelay) => {
9715
9722
  let timer;
9716
9723
  return (...args) => {
9724
+ const delay = getDelay();
9717
9725
  clearTimeout(timer);
9718
- timer = setTimeout(func, wait, ...args);
9726
+ timer = setTimeout(func, delay, ...args);
9719
9727
  };
9720
9728
  };
9721
9729
  /**
@@ -9790,32 +9798,6 @@ const isEmptyString = (value) => value ? value.trim().length === 0 : true;
9790
9798
  // A helper function that checks if a prop has been defined
9791
9799
  const isPropDefined = (prop) => prop !== undefined ? prop : null;
9792
9800
  const getCssProperty = (cssVar) => getComputedStyle(document.documentElement).getPropertyValue(cssVar);
9793
- const getSlot = (element, name) => {
9794
- if (element && element.querySelector) {
9795
- return element.querySelector(`[slot="${name}"]`);
9796
- }
9797
- return null;
9798
- };
9799
- const getSlotContent = (element, name) => {
9800
- const slot = getSlot(element, name);
9801
- if (slot) {
9802
- return getSlotElements(slot);
9803
- }
9804
- return null;
9805
- };
9806
- const getSlotElements = (slot) => {
9807
- const slotContent = slot.firstElementChild;
9808
- if (slotContent !== null) {
9809
- const elements = slotContent.assignedElements
9810
- ? slotContent.assignedElements()
9811
- : slotContent.childNodes;
9812
- return elements.length ? elements : slot.tagName ? [slot] : null;
9813
- }
9814
- else {
9815
- //check for single element
9816
- return slot === null ? null : [slot];
9817
- }
9818
- };
9819
9801
  ({
9820
9802
  XS: Number(getCssProperty("--ic-breakpoint-xs").replace("px", "")),
9821
9803
  S: Number(getCssProperty("--ic-breakpoint-sm").replace("px", "")),
@@ -9956,6 +9938,20 @@ const checkSlotInChildMutations = (addedNodes, removedNodes, slotName) => {
9956
9938
  const hasSlot = (nodeList) => Array.from(nodeList).some((node) => node.slot === slotName);
9957
9939
  return hasSlot(addedNodes) || hasSlot(removedNodes);
9958
9940
  };
9941
+ const addDataToPosition = (dataObject, newKeys, newValue) => {
9942
+ const newData = {};
9943
+ const newIndexes = newKeys.map((key) => key.index);
9944
+ let controlledIndex = 0; // When a new key is added to the data, need to increment the index to account for this new object value
9945
+ Object.keys(dataObject).forEach((dataKey) => {
9946
+ if (newIndexes.includes(controlledIndex)) {
9947
+ newData[newKeys[newIndexes.indexOf(controlledIndex)].key] = newValue;
9948
+ controlledIndex++;
9949
+ }
9950
+ newData[dataKey] = dataObject[dataKey];
9951
+ controlledIndex++;
9952
+ });
9953
+ return newData;
9954
+ };
9959
9955
 
9960
9956
  const icCardHorizontalCss = "/*!@html*/html.sc-ic-card-horizontal{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-card-horizontal{margin:0}/*!@main*/main.sc-ic-card-horizontal{display:block}/*!@h1*/h1.sc-ic-card-horizontal{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-card-horizontal{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-card-horizontal{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-card-horizontal{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-card-horizontal{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-card-horizontal,strong.sc-ic-card-horizontal{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-card-horizontal,kbd.sc-ic-card-horizontal,samp.sc-ic-card-horizontal{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-card-horizontal{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-card-horizontal,sup.sc-ic-card-horizontal{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-card-horizontal{bottom:-0.25em}/*!@sup*/sup.sc-ic-card-horizontal{top:-0.5em}/*!@img*/img.sc-ic-card-horizontal{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-card-horizontal,input.sc-ic-card-horizontal,optgroup.sc-ic-card-horizontal,select.sc-ic-card-horizontal,textarea.sc-ic-card-horizontal{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-card-horizontal,input.sc-ic-card-horizontal{overflow:visible}/*!@button,\nselect*/button.sc-ic-card-horizontal,select.sc-ic-card-horizontal{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-card-horizontal,[type=\"button\"].sc-ic-card-horizontal,[type=\"reset\"].sc-ic-card-horizontal,[type=\"submit\"].sc-ic-card-horizontal{-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-card-horizontal::-moz-focus-inner,[type=\"button\"].sc-ic-card-horizontal::-moz-focus-inner,[type=\"reset\"].sc-ic-card-horizontal::-moz-focus-inner,[type=\"submit\"].sc-ic-card-horizontal::-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-card-horizontal:-moz-focusring,[type=\"button\"].sc-ic-card-horizontal:-moz-focusring,[type=\"reset\"].sc-ic-card-horizontal:-moz-focusring,[type=\"submit\"].sc-ic-card-horizontal:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-card-horizontal{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-card-horizontal{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-card-horizontal{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-card-horizontal{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-card-horizontal,[type=\"radio\"].sc-ic-card-horizontal{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-card-horizontal::-webkit-inner-spin-button,[type=\"number\"].sc-ic-card-horizontal::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-card-horizontal{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-card-horizontal::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-card-horizontal::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-card-horizontal{display:block}/*!@summary*/summary.sc-ic-card-horizontal{display:list-item}/*!@template*/template.sc-ic-card-horizontal{display:none}/*!@[hidden]*/[hidden].sc-ic-card-horizontal{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-card-horizontal,body.sc-ic-card-horizontal,div.sc-ic-card-horizontal,span.sc-ic-card-horizontal,applet.sc-ic-card-horizontal,object.sc-ic-card-horizontal,iframe.sc-ic-card-horizontal,h1.sc-ic-card-horizontal,h2.sc-ic-card-horizontal,h3.sc-ic-card-horizontal,h4.sc-ic-card-horizontal,h5.sc-ic-card-horizontal,h6.sc-ic-card-horizontal,p.sc-ic-card-horizontal,blockquote.sc-ic-card-horizontal,pre.sc-ic-card-horizontal,a.sc-ic-card-horizontal,abbr.sc-ic-card-horizontal,acronym.sc-ic-card-horizontal,address.sc-ic-card-horizontal,big.sc-ic-card-horizontal,cite.sc-ic-card-horizontal,code.sc-ic-card-horizontal,del.sc-ic-card-horizontal,dfn.sc-ic-card-horizontal,em.sc-ic-card-horizontal,img.sc-ic-card-horizontal,ins.sc-ic-card-horizontal,kbd.sc-ic-card-horizontal,q.sc-ic-card-horizontal,s.sc-ic-card-horizontal,samp.sc-ic-card-horizontal,small.sc-ic-card-horizontal,strike.sc-ic-card-horizontal,strong.sc-ic-card-horizontal,sub.sc-ic-card-horizontal,sup.sc-ic-card-horizontal,tt.sc-ic-card-horizontal,var.sc-ic-card-horizontal,b.sc-ic-card-horizontal,u.sc-ic-card-horizontal,i.sc-ic-card-horizontal,center.sc-ic-card-horizontal,dl.sc-ic-card-horizontal,dt.sc-ic-card-horizontal,dd.sc-ic-card-horizontal,ol.sc-ic-card-horizontal,ul.sc-ic-card-horizontal,li.sc-ic-card-horizontal,fieldset.sc-ic-card-horizontal,form.sc-ic-card-horizontal,label.sc-ic-card-horizontal,legend.sc-ic-card-horizontal,table.sc-ic-card-horizontal,caption.sc-ic-card-horizontal,tbody.sc-ic-card-horizontal,tfoot.sc-ic-card-horizontal,thead.sc-ic-card-horizontal,tr.sc-ic-card-horizontal,th.sc-ic-card-horizontal,td.sc-ic-card-horizontal,article.sc-ic-card-horizontal,aside.sc-ic-card-horizontal,canvas.sc-ic-card-horizontal,details.sc-ic-card-horizontal,embed.sc-ic-card-horizontal,figure.sc-ic-card-horizontal,figcaption.sc-ic-card-horizontal,footer.sc-ic-card-horizontal,header.sc-ic-card-horizontal,hgroup.sc-ic-card-horizontal,menu.sc-ic-card-horizontal,nav.sc-ic-card-horizontal,output.sc-ic-card-horizontal,ruby.sc-ic-card-horizontal,section.sc-ic-card-horizontal,summary.sc-ic-card-horizontal,time.sc-ic-card-horizontal,mark.sc-ic-card-horizontal,audio.sc-ic-card-horizontal,video.sc-ic-card-horizontal{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@:host*/.sc-ic-card-horizontal-h{display:flex;--card-max-width:548px;--image-size:114px;--message-max-lines:2}/*!@.card.small*/.card.small.sc-ic-card-horizontal{--card-max-width:360px}/*!@.card.large*/.card.large.sc-ic-card-horizontal{--card-max-width:720px;--image-size:142px;--message-max-lines:3}/*!@.card.extra-large*/.card.extra-large.sc-ic-card-horizontal{--card-max-width:1130px;--image-size:186px;--message-max-lines:5}/*!@a*/a.sc-ic-card-horizontal{text-decoration:none !important;color:var(--ic-architectural-black) !important}/*!@button*/button.sc-ic-card-horizontal{border:none;background-color:transparent;outline:var(--ic-hc-focus-outline);padding:0}/*!@.card,\n.card.clickable*/.card.sc-ic-card-horizontal,.card.clickable.sc-ic-card-horizontal{display:flex;flex-direction:row;border:var(--ic-border-default);border-radius:var(--ic-border-radius);box-sizing:border-box;text-align:left;color:var(--ic-architectural-black);transition:var(--ic-easing-transition-fast);position:relative;max-width:var(--card-max-width);height:-moz-fit-content;height:fit-content;width:var(--card-horizontal-width, -moz-fit-content);width:var(--card-horizontal-width, fit-content)}/*!@.dark.card,\n.dark.card.clickable*/.dark.card.sc-ic-card-horizontal,.dark.card.clickable.sc-ic-card-horizontal{border:var(--ic-border-width) solid var(--ic-architectural-700)}/*!@.card.clickable:hover*/.card.clickable.sc-ic-card-horizontal:hover{background-color:var(--ic-action-default-bg-hover);border:var(--ic-border-hover);cursor:pointer}/*!@.card.clickable:focus,\n.card.clickable.focussed*/.card.clickable.sc-ic-card-horizontal:focus,.card.clickable.focussed.sc-ic-card-horizontal{background-color:var(--ic-action-default-bg-hover);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline);border:var(--ic-border-pressed)}/*!@.card.clickable:active*/.card.clickable.sc-ic-card-horizontal:active{background-color:var(--ic-action-default-bg-active);box-shadow:var(--ic-border-focus)}/*!@.card.disabled*/.card.disabled.sc-ic-card-horizontal{border:var(--ic-border-disabled)}/*!@.card-header*/.card-header.sc-ic-card-horizontal{display:flex;align-items:center}/*!@.icon*/.icon.sc-ic-card-horizontal{display:flex;align-items:center;padding-right:var(--ic-space-xs)}/*!@.card.disabled ::slotted(svg)*/.card.disabled .sc-ic-card-horizontal-s>svg{fill:var(--ic-color-tertiary-text)}/*!@.card.clickable .card-title*/.card.clickable.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{color:var(--ic-hyperlink);text-decoration:underline;text-decoration-thickness:var(--ic-space-1px)}/*!@.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title*/.card.clickable.sc-ic-card-horizontal:hover .card-title.sc-ic-card-horizontal,.card.clickable.sc-ic-card-horizontal:focus .card-title.sc-ic-card-horizontal,.card.clickable.focussed.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{display:inline-block;border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}/*!@.card.clickable:active .card-title*/.card.clickable.sc-ic-card-horizontal:active .card-title.sc-ic-card-horizontal{text-decoration:none}/*!@.card.disabled .card-title*/.card.disabled.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{text-decoration:underline;text-decoration-thickness:var(--ic-space-1px);text-decoration-color:var(--ic-color-tertiary-text);color:var(--ic-color-tertiary-text)}/*!@.card-message*/.card-message.sc-ic-card-horizontal{margin-top:var(--ic-space-xxxs);align-items:left}/*!@.card.disabled .card-message*/.card.disabled.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal{color:var(--ic-color-tertiary-text)}/*!@.image*/.image.sc-ic-card-horizontal{display:flex;height:var(--image-size);width:var(--image-size);border-radius:var(--ic-border-radius)}/*!@.card-content*/.card-content.sc-ic-card-horizontal{display:flex;flex-direction:column;padding:var(--ic-space-md)}/*!@.card .card-title ::slotted([slot=\"heading\"]),\n.card .card-title ic-typography p*/.card .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:calc(var(--card-max-width) - var(--ic-space-xl))}/*!@.card.with-icon .card-title ::slotted([slot=\"heading\"]),\n.card.with-icon .card-title ic-typography p*/.card.with-icon .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-icon.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(var(--card-max-width) - (2 * var(--ic-space-xl)))}/*!@.card.with-image .card-title ::slotted([slot=\"heading\"]),\n.card.with-image .card-title ic-typography p*/.card.with-image .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-image.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(\n var(--card-max-width) - var(--image-size) - var(--ic-space-xl)\n )}/*!@.card.with-image.with-icon .card-title ::slotted([slot=\"heading\"]),\n.card.with-image.with-icon .card-title ic-typography p*/.card.with-image.with-icon .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-image.with-icon.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(\n var(--card-max-width) - var(--image-size) - (2 * var(--ic-space-xl))\n )}/*!@.card .card-message ::slotted([slot=\"message\"]),\n.card .card-message ic-typography*/.card .card-message .sc-ic-card-horizontal-s>[slot=\"message\"],.card.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal{display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--message-max-lines, initial);-webkit-line-clamp:var(--message-max-lines, initial);overflow:hidden}@media (forced-colors: active){/*!@.card ::slotted(svg)*/.card .sc-ic-card-horizontal-s>svg{fill:currentcolor}/*!@.card.disabled ::slotted(svg)*/.card.disabled .sc-ic-card-horizontal-s>svg{fill:GrayText !important}/*!@.card.disabled*/.card.disabled.sc-ic-card-horizontal{border-color:GrayText !important}/*!@.card.disabled .card-message,\n .card.disabled .card-title*/.card.disabled.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal,.card.disabled.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{color:GrayText}}";
9961
9957
 
@@ -10658,7 +10654,7 @@ var descendingIcon = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24
10658
10654
  <path d="M16.01 11H4v2h12.01v3L20 12l-3.99-4z"></path>
10659
10655
  </svg>`;
10660
10656
 
10661
- const icDataTableCss = "/*!@:host*/.sc-ic-data-table-h{position:relative;display:block;height:100%;max-height:100%}/*!@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}/*!@.cell-container*/.cell-container.sc-ic-data-table{display:flex;min-height:1.5rem;overflow-y:hidden}/*!@.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:fixed;border-spacing:0;width:100%}/*!@.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-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*/.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*/.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)}/*!@.column-header,\n.row-header*/.column-header.sc-ic-data-table,.row-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: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}/*!@.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}@media screen and (min-width: 576px){/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{display:flex;align-items:center}}";
10657
+ 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)}/*!@.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: 576px){/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{display:flex;align-items:center}}";
10662
10658
 
10663
10659
  /**
10664
10660
  * @slot empty-state - Content is slotted below the table header when there is no data and the table is not loading.
@@ -10701,8 +10697,11 @@ class DataTable {
10701
10697
  this.icPageChangeEvent = false;
10702
10698
  this.itemsPerPageChange = false;
10703
10699
  this.DATA_ROW_HEIGHT_STRING = "data-row-height";
10700
+ this.ROW_HEIGHT_CSS_VARIABLE = "--row-height";
10704
10701
  this.DEFAULT_LINE_HEIGHT = 24;
10705
10702
  this.densityUpdate = false;
10703
+ this.truncationPatternUpdated = false;
10704
+ this.isNewDebounceDelaySet = false;
10706
10705
  this.updateSetRowHeight = (typographyEl) => {
10707
10706
  const fontSize = parseInt(getComputedStyle(document.documentElement).fontSize);
10708
10707
  if (typographyEl) {
@@ -10710,7 +10709,7 @@ class DataTable {
10710
10709
  const rowHeight = fontSize *
10711
10710
  parseFloat(cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
10712
10711
  if (typographyEl.scrollHeight > rowHeight) {
10713
- cellContainer.style.removeProperty("height");
10712
+ cellContainer.style.removeProperty(this.ROW_HEIGHT_CSS_VARIABLE);
10714
10713
  }
10715
10714
  }
10716
10715
  else {
@@ -10719,24 +10718,31 @@ class DataTable {
10719
10718
  const rowHeight = fontSize *
10720
10719
  parseFloat(cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
10721
10720
  if (typographyEl.scrollHeight > rowHeight) {
10722
- cellContainer.style.removeProperty("height");
10721
+ cellContainer.style.removeProperty(this.ROW_HEIGHT_CSS_VARIABLE);
10723
10722
  }
10724
10723
  });
10725
10724
  }
10726
10725
  };
10727
10726
  this.debounceDataTruncation = () => {
10728
10727
  this.getTypographyElements().forEach((typographyEl) => {
10729
- if (!typographyEl.classList.contains(this.TEXT_WRAP_STRING)) {
10728
+ const cellContainer = this.getCellContainer(typographyEl);
10729
+ if (!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
10730
10730
  this.resizeObserver = new ResizeObserver(
10731
10731
  // This gets triggered twice due to updated data and see more/see less button
10732
- debounce$2(() => {
10733
- // console.log("resizeObserver triggered");
10732
+ dynamicDebounce(() => {
10734
10733
  this.dataTruncation(typographyEl);
10735
- }, 200));
10734
+ if (!this.isNewDebounceDelaySet) {
10735
+ this.setNewDebounceDelay(200);
10736
+ }
10737
+ }, () => this.debounceDelay));
10736
10738
  this.resizeObserver.observe(typographyEl);
10737
10739
  }
10738
10740
  });
10739
10741
  };
10742
+ this.setNewDebounceDelay = (delay) => {
10743
+ this.debounceDelay = delay;
10744
+ this.isNewDebounceDelaySet = true;
10745
+ };
10740
10746
  this.getLines = (height) => Math.floor(height / this.DEFAULT_LINE_HEIGHT);
10741
10747
  this.truncate = (typographyEl, cellContainer, tooltip) => {
10742
10748
  if ((typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > (cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight)) {
@@ -10865,11 +10871,40 @@ class DataTable {
10865
10871
  }
10866
10872
  return {};
10867
10873
  };
10874
+ this.getColumnWidth = (columnWidth) => {
10875
+ // TODO: Setting max width on columns
10876
+ let columnWidthStyling = {};
10877
+ if (columnWidth) {
10878
+ if (typeof columnWidth === "string") {
10879
+ columnWidthStyling = Object.assign(Object.assign({}, columnWidthStyling), { ["--column-width"]: columnWidth });
10880
+ }
10881
+ if (typeof columnWidth === "object" && !!Object.keys(columnWidth)) {
10882
+ if (columnWidth === null || columnWidth === void 0 ? void 0 : columnWidth.minWidth) {
10883
+ columnWidthStyling = Object.assign(Object.assign({}, columnWidthStyling), { ["--column-min-width"]: columnWidth === null || columnWidth === void 0 ? void 0 : columnWidth.minWidth });
10884
+ }
10885
+ if (columnWidth === null || columnWidth === void 0 ? void 0 : columnWidth.maxWidth) {
10886
+ columnWidthStyling = Object.assign(Object.assign({}, columnWidthStyling), { ["--column-max-width"]: columnWidth === null || columnWidth === void 0 ? void 0 : columnWidth.maxWidth });
10887
+ }
10888
+ }
10889
+ }
10890
+ return columnWidthStyling;
10891
+ };
10892
+ this.getRowHeight = (currentRowHeight, columnProps, rowTextWrap, cell) => {
10893
+ if ((this.truncationPattern || currentRowHeight) &&
10894
+ !(columnProps === null || columnProps === void 0 ? void 0 : columnProps.textWrap) &&
10895
+ !rowTextWrap &&
10896
+ !this.getCellOptions(cell, "textWrap") &&
10897
+ (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element") {
10898
+ return {
10899
+ [this.ROW_HEIGHT_CSS_VARIABLE]: this.setRowHeight(currentRowHeight),
10900
+ };
10901
+ }
10902
+ return {};
10903
+ };
10868
10904
  this.createCells = (row, rowIndex) => {
10869
10905
  var _a;
10870
10906
  const rowValues = Object.values(row);
10871
10907
  const rowKeys = Object.keys(row);
10872
- const index = rowIndex;
10873
10908
  const rowOptions = this.getRowOptions(rowKeys, rowValues);
10874
10909
  let rowAlignment;
10875
10910
  let rowEmphasis;
@@ -10878,7 +10913,7 @@ class DataTable {
10878
10913
  rowAlignment = this.getObjectValue(rowValues[headerIndex], "rowAlignment");
10879
10914
  rowEmphasis = this.getObjectValue(rowValues[headerIndex], "emphasis");
10880
10915
  }
10881
- const variableRowHeightVal = (_a = this.variableRowHeight) === null || _a === void 0 ? void 0 : _a.call(this, Object.assign(Object.assign({}, row), { index }));
10916
+ const variableRowHeightVal = (_a = this.variableRowHeight) === null || _a === void 0 ? void 0 : _a.call(this, Object.assign(Object.assign({}, row), { index: rowIndex }));
10882
10917
  const currentRowHeight = variableRowHeightVal
10883
10918
  ? variableRowHeightVal !== "auto" && variableRowHeightVal
10884
10919
  : this.globalRowHeight !== "auto" && this.globalRowHeight;
@@ -10899,7 +10934,7 @@ class DataTable {
10899
10934
  return (hAsync("td", { class: {
10900
10935
  ["table-cell"]: true,
10901
10936
  [`table-density-${this.density}`]: this.notDefaultDensity(),
10902
- } }, hAsync("div", { innerHTML: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) === "element" &&
10937
+ }, style: Object.assign({}, this.getColumnWidth(columnProps.columnWidth)) }, hAsync("div", { innerHTML: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) === "element" &&
10903
10938
  !isSlotUsed(this.el, cellSlotName)
10904
10939
  ? cell
10905
10940
  : null, class: Object.assign({ "cell-container": (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element", [`cell-alignment-${((_a = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _a === void 0 ? void 0 : _a.vertical) ||
@@ -10914,15 +10949,7 @@ class DataTable {
10914
10949
  !!((_h = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _h === void 0 ? void 0 : _h.horizontal) ||
10915
10950
  !!this.getCellAlignment(cell, "horizontal"), [`data-type-${columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType}`]: true, [this.TEXT_WRAP_STRING]: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.textWrap) ||
10916
10951
  (rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap) ||
10917
- !!this.getCellOptions(cell, "textWrap"), ["cell-icon"]: hasIcon || !!((_j = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _j === void 0 ? void 0 : _j.icon) }, this.setTruncationClass()), style: {
10918
- height: (this.truncationPattern || currentRowHeight) &&
10919
- !columnProps.textWrap &&
10920
- !rowOptions.textWrap &&
10921
- !this.getCellOptions(cell, "textWrap") &&
10922
- (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element"
10923
- ? this.setRowHeight(currentRowHeight)
10924
- : null,
10925
- }, "data-row-height": this.truncationPattern || currentRowHeight
10952
+ !!this.getCellOptions(cell, "textWrap"), ["cell-icon"]: hasIcon || !!((_j = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _j === void 0 ? void 0 : _j.icon) }, this.setTruncationClass()), style: Object.assign(Object.assign({}, this.getRowHeight(currentRowHeight, columnProps, rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap, cell)), this.getColumnWidth(columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnWidth)), "data-row-height": this.truncationPattern || currentRowHeight
10926
10953
  ? this.setRowHeight(currentRowHeight)
10927
10954
  : null }, isSlotUsed(this.el, cellSlotName) ? (hAsync("slot", { name: cellSlotName })) : (hAsync(Fragment, null, isSlotUsed(this.el, `${cellSlotName}-icon`) ? (hAsync("slot", { name: `${cellSlotName}-icon` })) : ((hasIcon || ((_k = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _k === void 0 ? void 0 : _k.onAllCells)) && (hAsync("span", { class: "icon", innerHTML: cellValue("icon") || (columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon.icon) }))), (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element" &&
10928
10955
  !isSlotUsed(this.el, cellSlotName) && (hAsync("ic-typography", { variant: "body", class: {
@@ -10938,11 +10965,11 @@ class DataTable {
10938
10965
  });
10939
10966
  };
10940
10967
  this.createColumnHeaders = () => {
10941
- return this.columns.map(({ cellAlignment, colspan, icon, key, title }) => (hAsync("th", { scope: "col", class: {
10968
+ return this.columns.map(({ cellAlignment, colspan, icon, key, title, columnWidth }) => (hAsync("th", { scope: "col", class: {
10942
10969
  ["column-header"]: true,
10943
10970
  [`table-density-${this.density}`]: this.notDefaultDensity(),
10944
10971
  ["updating-state-headers"]: this.updating && !this.loading,
10945
- }, colSpan: colspan }, hAsync("div", { class: {
10972
+ }, style: Object.assign({}, this.getColumnWidth(columnWidth)), colSpan: colspan }, hAsync("div", { class: {
10946
10973
  "column-header-inner-container": true,
10947
10974
  [`column-header-alignment-${cellAlignment}`]: !!cellAlignment,
10948
10975
  } }, isSlotUsed(this.el, `${key}-column-icon`) ? (hAsync("slot", { name: `${key}-column-icon` })) : (icon &&
@@ -10970,16 +10997,18 @@ class DataTable {
10970
10997
  /**
10971
10998
  * Ensures that createCells has a value in data to map over to actually render the slot.
10972
10999
  * Removes the need for the user to add it multiple times.
11000
+ * `addDataToPosition` used to add the element in the correct column order.
11001
+ * Adding empty string value in to give `createCells` something to loop over.
10973
11002
  */
10974
- this.columns.forEach(({ key }) => {
10975
- data.forEach((row, rowIndex) => {
10976
- const cellSlotName = `${key}-${rowIndex}`;
10977
- if (isSlotUsed(this.el, cellSlotName)) {
10978
- row[key] = getSlotContent(this.el, cellSlotName);
10979
- }
10980
- });
11003
+ const organisedData = data.map((row, rowIndex) => {
11004
+ const slottedColumns = this.columns
11005
+ .map(({ key }, index) => isSlotUsed(this.el, `${key}-${rowIndex}`) && { key, index })
11006
+ .filter((col) => !!col);
11007
+ return slottedColumns.length > 0
11008
+ ? addDataToPosition(row, slottedColumns, "")
11009
+ : row;
10981
11010
  });
10982
- return data
11011
+ return organisedData
10983
11012
  .sort(!this.sortable ? undefined : this.getSortFunction())
10984
11013
  .map((row, index) => {
10985
11014
  return (hAsync("tr", {
@@ -11076,6 +11105,22 @@ class DataTable {
11076
11105
  this.updateScrollOffset = () => {
11077
11106
  this.scrollOffset = this.el.shadowRoot.querySelector(".table-row-container").scrollTop;
11078
11107
  };
11108
+ this.setTableDimensions = () => {
11109
+ let tableHostDimensions = {};
11110
+ if (this.width) {
11111
+ tableHostDimensions = Object.assign(Object.assign({}, tableHostDimensions), { ["--table-width"]: this.width });
11112
+ }
11113
+ if (this.height) {
11114
+ tableHostDimensions = Object.assign(Object.assign({}, tableHostDimensions), { ["--table-height"]: this.height });
11115
+ }
11116
+ if (this.maxWidth) {
11117
+ tableHostDimensions = Object.assign(Object.assign({}, tableHostDimensions), { ["--table-max-width"]: this.maxWidth });
11118
+ }
11119
+ if (this.minWidth) {
11120
+ tableHostDimensions = Object.assign(Object.assign({}, tableHostDimensions), { ["--table-min-width"]: this.minWidth });
11121
+ }
11122
+ return tableHostDimensions;
11123
+ };
11079
11124
  this.fromRow = 0;
11080
11125
  this.previousRowsPerPage = undefined;
11081
11126
  this.rowsPerPage = undefined;
@@ -11086,15 +11131,19 @@ class DataTable {
11086
11131
  this.sortedColumnOrder = undefined;
11087
11132
  this.toRow = undefined;
11088
11133
  this.currentRowHeight = undefined;
11134
+ this.debounceDelay = 0;
11089
11135
  this.caption = undefined;
11090
11136
  this.columns = undefined;
11091
11137
  this.data = undefined;
11092
11138
  this.density = "default";
11093
11139
  this.embedded = false;
11094
11140
  this.globalRowHeight = "auto";
11141
+ this.height = undefined;
11095
11142
  this.hideColumnHeaders = false;
11096
11143
  this.loading = false;
11097
11144
  this.loadingOptions = undefined;
11145
+ this.maxWidth = undefined;
11146
+ this.minWidth = undefined;
11098
11147
  this.minimumLoadingDisplayDuration = 1000;
11099
11148
  this.paginationBarOptions = {
11100
11149
  itemsPerPageOptions: [
@@ -11120,10 +11169,12 @@ class DataTable {
11120
11169
  };
11121
11170
  this.stickyColumnHeaders = false;
11122
11171
  this.stickyRowHeaders = false;
11172
+ this.tableLayout = "fixed";
11123
11173
  this.truncationPattern = undefined;
11124
11174
  this.updating = false;
11125
11175
  this.updatingOptions = undefined;
11126
11176
  this.variableRowHeight = undefined;
11177
+ this.width = undefined;
11127
11178
  }
11128
11179
  disconnectedCallback() {
11129
11180
  var _a;
@@ -11156,7 +11207,8 @@ class DataTable {
11156
11207
  }
11157
11208
  if (this.truncationPattern) {
11158
11209
  this.getTypographyElements().forEach((typographyEl) => {
11159
- if (!typographyEl.classList.contains(this.TEXT_WRAP_STRING)) {
11210
+ const cellContainer = this.getCellContainer(typographyEl);
11211
+ if (!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
11160
11212
  this.dataTruncation(typographyEl);
11161
11213
  }
11162
11214
  });
@@ -11167,12 +11219,31 @@ class DataTable {
11167
11219
  }
11168
11220
  }
11169
11221
  componentDidUpdate() {
11170
- this.truncateUpdatedData();
11222
+ // truncation updates invoked here once new/updated data has
11223
+ // rendered to take into account updated .cell-container/ic-typography box model updates.
11224
+ if (this.truncationPattern === this.SHOW_HIDE_STRING ||
11225
+ this.truncationPattern === this.TOOLTIP_STRING) {
11226
+ this.truncateUpdatedData();
11227
+ }
11171
11228
  }
11172
11229
  truncateUpdatedData() {
11173
11230
  if (this.dataUpdated) {
11174
11231
  if (this.truncationPattern === this.SHOW_HIDE_STRING) {
11175
- this.resetShowHideTruncation();
11232
+ this.getTypographyElements().forEach((typographyEl) => {
11233
+ const truncWrapper = this.getTruncWrapper(typographyEl);
11234
+ const cellContainer = this.getCellContainer(typographyEl);
11235
+ if ((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) - this.DEFAULT_LINE_HEIGHT >=
11236
+ (truncWrapper === null || truncWrapper === void 0 ? void 0 : truncWrapper.scrollHeight)) {
11237
+ this.resetShowHideTruncation(typographyEl);
11238
+ return;
11239
+ }
11240
+ setTimeout(() => {
11241
+ // slight delay due to data rendering
11242
+ if ((typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > (cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight)) {
11243
+ this.addShowHideTruncation(cellContainer, typographyEl);
11244
+ }
11245
+ }, 150);
11246
+ });
11176
11247
  }
11177
11248
  if (this.truncationPattern === this.TOOLTIP_STRING) {
11178
11249
  this.updateTruncationTooltip();
@@ -11183,23 +11254,49 @@ class DataTable {
11183
11254
  if (this.truncationPattern === this.TOOLTIP_STRING) {
11184
11255
  this.updateTruncationTooltip();
11185
11256
  }
11257
+ if (this.truncationPattern === this.SHOW_HIDE_STRING) {
11258
+ this.getTypographyElements().forEach((typographyEl) => {
11259
+ const cellContainer = this.getCellContainer(typographyEl);
11260
+ if (!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
11261
+ this.createShowHideTruncation(typographyEl, cellContainer);
11262
+ }
11263
+ else {
11264
+ typographyEl.resetTruncation().then(() => {
11265
+ cellContainer.removeAttribute("style");
11266
+ });
11267
+ }
11268
+ });
11269
+ }
11186
11270
  this.tableSorted = false;
11187
11271
  }
11188
11272
  // This function recalculates the tooltip truncation when the rowHeight has been set.
11189
11273
  // This is in componentDidUpdate so a setTimeout is not used to wait for the render to be complete
11190
11274
  if (this.rowHeightSet) {
11191
11275
  const fontSize = parseInt(getComputedStyle(document.documentElement).fontSize);
11276
+ const hasAutoRowHeight = this.globalRowHeight === "auto";
11192
11277
  this.getTypographyElements().forEach((typographyEl) => {
11193
11278
  var _a;
11194
11279
  const cellContainer = this.getCellContainer(typographyEl);
11195
11280
  const tooltipEl = this.getTooltip(typographyEl);
11281
+ if (hasAutoRowHeight) {
11282
+ cellContainer.style.height = null;
11283
+ if (this.truncationPattern === this.TOOLTIP_STRING) {
11284
+ this.removeTooltip(cellContainer, typographyEl, tooltipEl);
11285
+ typographyEl.setAttribute("style", `--ic-line-clamp: 0`);
11286
+ }
11287
+ else if (this.truncationPattern === this.SHOW_HIDE_STRING) {
11288
+ this.resetShowHideTruncation(typographyEl);
11289
+ }
11290
+ return;
11291
+ }
11196
11292
  const rowHeight = fontSize *
11197
11293
  parseFloat(cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
11198
11294
  // If the set row height is bigger than the cell container even
11199
11295
  // with textWrap, set the row height
11200
11296
  if (!((_a = cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.style) === null || _a === void 0 ? void 0 : _a.height) &&
11201
- rowHeight > cellContainer.clientHeight) {
11202
- cellContainer.style.setProperty("height", cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
11297
+ rowHeight > cellContainer.clientHeight &&
11298
+ !cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
11299
+ cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
11203
11300
  }
11204
11301
  if (this.truncationPattern) {
11205
11302
  // If the set row height is bigger than the typography truncation wrapper
@@ -11265,12 +11362,37 @@ class DataTable {
11265
11362
  });
11266
11363
  this.densityUpdate = false;
11267
11364
  }
11365
+ if (this.truncationPatternUpdated) {
11366
+ if (this.truncationPattern === this.TOOLTIP_STRING) {
11367
+ this.getTypographyElements().forEach((typographyEl) => {
11368
+ const cellContainer = this.getCellContainer(typographyEl);
11369
+ const tooltipEl = this.getTooltip(typographyEl);
11370
+ if (typographyEl.scrollHeight > cellContainer.clientHeight) {
11371
+ this.addTooltipTruncation(typographyEl, cellContainer, tooltipEl);
11372
+ }
11373
+ });
11374
+ }
11375
+ else if (this.truncationPattern === this.SHOW_HIDE_STRING) {
11376
+ this.getTypographyElements().forEach((typographyEl) => {
11377
+ const truncWrapper = this.getTruncWrapper(typographyEl);
11378
+ const cellContainer = this.getCellContainer(typographyEl);
11379
+ if ((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) - this.DEFAULT_LINE_HEIGHT >
11380
+ (truncWrapper === null || truncWrapper === void 0 ? void 0 : truncWrapper.scrollHeight)) {
11381
+ this.resetShowHideTruncation(typographyEl);
11382
+ return;
11383
+ }
11384
+ if ((typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > (cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight)) {
11385
+ this.addShowHideTruncation(cellContainer, typographyEl);
11386
+ }
11387
+ });
11388
+ }
11389
+ }
11268
11390
  }
11269
11391
  createShowHideTruncation(typographyEl, cellContainer) {
11270
11392
  typographyEl.checkMaxLines(typographyEl.scrollHeight);
11271
11393
  typographyEl.setAttribute("max-lines", `${Math.floor((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) / this.DEFAULT_LINE_HEIGHT)}`);
11272
11394
  typographyEl.setShowHideExpanded(false);
11273
- cellContainer.style.height = null;
11395
+ cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, null);
11274
11396
  }
11275
11397
  addTooltipTruncation(typographyEl, cellContainer, tooltip) {
11276
11398
  this.addLineClampCSS(typographyEl, cellContainer);
@@ -11290,8 +11412,9 @@ class DataTable {
11290
11412
  handleTypographyTruncationExpandToggle({ detail, }) {
11291
11413
  const { expanded, typographyEl } = detail;
11292
11414
  const cellContainer = this.getCellContainer(typographyEl);
11293
- if (cellContainer.style.height && expanded) {
11294
- cellContainer.style.height = "inherit";
11415
+ if (cellContainer.style.getPropertyValue(this.ROW_HEIGHT_CSS_VARIABLE) &&
11416
+ expanded) {
11417
+ cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, "inherit");
11295
11418
  }
11296
11419
  }
11297
11420
  handlePageChange({ detail, target }) {
@@ -11341,7 +11464,8 @@ class DataTable {
11341
11464
  }
11342
11465
  }
11343
11466
  truncationPatternHandler(newValue) {
11344
- if (newValue === this.SHOW_HIDE_STRING) {
11467
+ if (newValue === this.TOOLTIP_STRING) {
11468
+ this.resetShowHideTruncation();
11345
11469
  this.updateTruncationTooltip(true);
11346
11470
  // Not using debounceDataTruncation here due to resizeObserver not being triggered
11347
11471
  this.getTypographyElements().forEach((typographyEl) => {
@@ -11350,11 +11474,27 @@ class DataTable {
11350
11474
  this.truncate(typographyEl, cellContainer, tooltip);
11351
11475
  });
11352
11476
  }
11353
- if (newValue === this.TOOLTIP_STRING) {
11477
+ if (newValue === this.SHOW_HIDE_STRING) {
11354
11478
  // ResizeObserver is trigger here due to the see more/see less links being removed.
11355
11479
  // The resizeObserver will also apply the tooltip where relevant
11356
- this.resetShowHideTruncation();
11480
+ this.updateTruncationTooltip(true);
11481
+ this.getTypographyElements().forEach((typographyEl) => {
11482
+ const truncWrapper = this.getTruncWrapper(typographyEl);
11483
+ const cellContainer = this.getCellContainer(typographyEl);
11484
+ if ((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) - this.DEFAULT_LINE_HEIGHT >
11485
+ (truncWrapper === null || truncWrapper === void 0 ? void 0 : truncWrapper.scrollHeight)) {
11486
+ this.resetShowHideTruncation(typographyEl);
11487
+ return;
11488
+ }
11489
+ setTimeout(() => {
11490
+ // slight delay due to data rendering
11491
+ if ((typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > (cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight)) {
11492
+ this.addShowHideTruncation(cellContainer, typographyEl);
11493
+ }
11494
+ }, 150);
11495
+ });
11357
11496
  }
11497
+ this.truncationPatternUpdated = true;
11358
11498
  }
11359
11499
  async dataHandler(newData) {
11360
11500
  this.loadingOptions = Object.assign(Object.assign({}, this.loadingOptions), { showBackground: (newData === null || newData === void 0 ? void 0 : newData.length) > 0 });
@@ -11382,11 +11522,13 @@ class DataTable {
11382
11522
  typographyEl.checkMaxLines(truncWrapper.scrollHeight);
11383
11523
  typographyEl.setAttribute("max-lines", `${Math.floor((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) / this.DEFAULT_LINE_HEIGHT)}`);
11384
11524
  typographyEl.setShowHideExpanded(false);
11385
- cellContainer.style.height = null;
11525
+ cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, null);
11386
11526
  }
11387
11527
  else {
11388
11528
  typographyEl.resetTruncation().then(() => {
11389
- cellContainer.style.setProperty("height", cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
11529
+ if (!typographyEl.closest(this.TEXT_WRAP_CLASS)) {
11530
+ cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
11531
+ }
11390
11532
  });
11391
11533
  }
11392
11534
  }
@@ -11394,7 +11536,9 @@ class DataTable {
11394
11536
  this.getTypographyElements().forEach((typographyEl) => {
11395
11537
  const cellContainer = this.getCellContainer(typographyEl);
11396
11538
  typographyEl.resetTruncation().then(() => {
11397
- cellContainer.style.setProperty("height", cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
11539
+ if (!typographyEl.closest(this.TEXT_WRAP_CLASS)) {
11540
+ cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
11541
+ }
11398
11542
  });
11399
11543
  });
11400
11544
  }
@@ -11442,11 +11586,10 @@ class DataTable {
11442
11586
  if (!typographyEl.getAttribute("style") && this.dataUpdated) {
11443
11587
  this.addLineClampCSS(typographyEl, cellContainer);
11444
11588
  }
11445
- // Adding the tableSorted boolean prevents the tooltip
11446
- // being regenerated and flashing
11447
11589
  if ((typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > (cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) &&
11448
- !this.tableSorted) {
11449
- if (!typographyEl.getAttribute("style")) {
11590
+ this.truncationPattern === this.TOOLTIP_STRING) {
11591
+ if (!typographyEl.getAttribute("style") ||
11592
+ typographyEl.style.cssText.includes("--ic-line-clamp: 0;")) {
11450
11593
  this.addLineClampCSS(typographyEl, cellContainer);
11451
11594
  }
11452
11595
  this.createTruncationTooltip(typographyEl, cellContainer);
@@ -11475,10 +11618,12 @@ class DataTable {
11475
11618
  }
11476
11619
  render() {
11477
11620
  const { caption, createColumnHeaders, createRows, createUpdatingIndicator, data, hideColumnHeaders, loading, loadingOptions, paginationBarOptions, scrollable, scrollOffset, showPagination, sortable, sortedColumnOrder, sortedColumn, stickyColumnHeaders, updateScrollOffset, updating, } = this;
11478
- return (hAsync("div", { class: "table-container" }, isSlotUsed(this.el, "title-bar") && hAsync("slot", { name: "title-bar" }), hAsync("div", { class: {
11621
+ return (hAsync(Host, { style: Object.assign({}, this.setTableDimensions()) }, hAsync("div", { class: "table-container" }, isSlotUsed(this.el, "title-bar") && hAsync("slot", { name: "title-bar" }), hAsync("div", { class: {
11479
11622
  ["table-row-container"]: true,
11480
11623
  scrollable,
11481
- }, tabIndex: scrollable ? 0 : null, onScroll: updateScrollOffset }, isSlotUsed(this.el, "title-bar") && hAsync("slot", { name: "title-bar" }), hAsync("table", null, hAsync("caption", { class: "table-caption" }, caption), !hideColumnHeaders && (hAsync("thead", { class: {
11624
+ }, tabIndex: scrollable ? 0 : null, onScroll: updateScrollOffset }, isSlotUsed(this.el, "title-bar") && hAsync("slot", { name: "title-bar" }), hAsync("table", { style: {
11625
+ ["--table-layout"]: this.tableLayout,
11626
+ } }, hAsync("caption", { class: "table-caption" }, caption), !hideColumnHeaders && (hAsync("thead", { class: {
11482
11627
  ["column-header-sticky"]: stickyColumnHeaders,
11483
11628
  ["column-header-overlay"]: stickyColumnHeaders && scrollOffset !== 0,
11484
11629
  } }, hAsync("tr", null, createColumnHeaders()))), updating &&
@@ -11491,7 +11636,7 @@ class DataTable {
11491
11636
  "show-background": loadingOptions.showBackground,
11492
11637
  }, description: loadingOptions.description || "Loading table data", label: loadingOptions.label || "Loading...", labelDuration: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.labelDuration, max: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.max, min: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.min, progress: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.progress, ref: (el) => (this.loadingIndicator = el) })), (showPagination || isSlotUsed(this.el, "pagination-bar")) && (hAsync("div", { class: "pagination-container" }, isSlotUsed(this.el, "pagination-bar") ? (hAsync("slot", { name: "pagination-bar" })) : (hAsync("ic-pagination-bar", { totalItems: data.length, type: paginationBarOptions.type, rangeLabelType: paginationBarOptions.rangeLabelType, showItemsPerPageControl: paginationBarOptions.showItemsPerPageControl, showGoToPageControl: paginationBarOptions.showGoToPageControl, itemsPerPageOptions: paginationBarOptions.itemsPerPageOptions, alignment: paginationBarOptions.alignment, appearance: paginationBarOptions.appearance, itemLabel: paginationBarOptions.itemLabel, pageLabel: paginationBarOptions.pageLabel, hideRangeLabel: paginationBarOptions.hideRangeLabel })))), sortable && (hAsync("div", { class: "screen-reader-sort-text", "aria-live": "polite" }, sortedColumnOrder !== "unsorted" && sortedColumn
11493
11638
  ? `${sortedColumn} sorted ${sortedColumnOrder}`
11494
- : "table unsorted"))));
11639
+ : "table unsorted")))));
11495
11640
  }
11496
11641
  get el() { return getElement(this); }
11497
11642
  static get watchers() { return {
@@ -11513,9 +11658,12 @@ class DataTable {
11513
11658
  "density": [1025],
11514
11659
  "embedded": [4],
11515
11660
  "globalRowHeight": [1032, "global-row-height"],
11661
+ "height": [1],
11516
11662
  "hideColumnHeaders": [4, "hide-column-headers"],
11517
11663
  "loading": [1028],
11518
11664
  "loadingOptions": [16],
11665
+ "maxWidth": [1, "max-width"],
11666
+ "minWidth": [1, "min-width"],
11519
11667
  "minimumLoadingDisplayDuration": [2, "minimum-loading-display-duration"],
11520
11668
  "paginationBarOptions": [16],
11521
11669
  "showPagination": [4, "show-pagination"],
@@ -11523,10 +11671,12 @@ class DataTable {
11523
11671
  "sortOptions": [16],
11524
11672
  "stickyColumnHeaders": [4, "sticky-column-headers"],
11525
11673
  "stickyRowHeaders": [4, "sticky-row-headers"],
11674
+ "tableLayout": [1, "table-layout"],
11526
11675
  "truncationPattern": [1, "truncation-pattern"],
11527
11676
  "updating": [4],
11528
11677
  "updatingOptions": [16],
11529
11678
  "variableRowHeight": [1040],
11679
+ "width": [1],
11530
11680
  "fromRow": [32],
11531
11681
  "previousRowsPerPage": [32],
11532
11682
  "rowsPerPage": [32],
@@ -11537,6 +11687,7 @@ class DataTable {
11537
11687
  "sortedColumnOrder": [32],
11538
11688
  "toRow": [32],
11539
11689
  "currentRowHeight": [32],
11690
+ "debounceDelay": [32],
11540
11691
  "resetRowHeights": [64]
11541
11692
  },
11542
11693
  "$listeners$": [[0, "typographyTruncationExpandToggle", "handleTypographyTruncationExpandToggle"], [0, "icPageChange", "handlePageChange"], [0, "icItemsPerPageChange", "handleItemsPerPageChange"], [0, "icTableDensityUpdate", "handleDensityChange"], [8, "click", "clickListener"]],
@@ -12168,7 +12319,7 @@ class DateInput {
12168
12319
  this.selectedDate = null;
12169
12320
  }
12170
12321
  if (!(this.isValidDay && this.isValidMonth && this.isValidDate)) {
12171
- this.invalidDateText = "Please enter a valid date.";
12322
+ this.invalidDateText = this.invalidDateMessage;
12172
12323
  }
12173
12324
  else if (this.isDisabledDate && this.selectedDate !== null) {
12174
12325
  if (this.isBeforeMin) {
@@ -12567,6 +12718,7 @@ class DateInput {
12567
12718
  this.helperText = undefined;
12568
12719
  this.hideHelperText = false;
12569
12720
  this.inputId = `ic-date-input-${inputIds$5++}`;
12721
+ this.invalidDateMessage = "Please enter a valid date.";
12570
12722
  this.label = undefined;
12571
12723
  this.max = "";
12572
12724
  this.min = "";
@@ -12855,6 +13007,7 @@ class DateInput {
12855
13007
  "helperText": [1025, "helper-text"],
12856
13008
  "hideHelperText": [4, "hide-helper-text"],
12857
13009
  "inputId": [1, "input-id"],
13010
+ "invalidDateMessage": [1, "invalid-date-message"],
12858
13011
  "label": [1],
12859
13012
  "max": [1],
12860
13013
  "min": [1],
@@ -13634,6 +13787,7 @@ class DatePicker {
13634
13787
  };
13635
13788
  this.setDateInputProps = () => {
13636
13789
  const inputProps = {
13790
+ invalidDateMessage: this.invalidDateMessage,
13637
13791
  label: this.label,
13638
13792
  showClearButton: true,
13639
13793
  showCalendarButton: true,
@@ -13724,6 +13878,7 @@ class DatePicker {
13724
13878
  this.helperText = undefined;
13725
13879
  this.hideHelperText = false;
13726
13880
  this.inputId = undefined;
13881
+ this.invalidDateMessage = "Please enter a valid date.";
13727
13882
  this.label = undefined;
13728
13883
  this.max = "";
13729
13884
  this.min = "";
@@ -13955,6 +14110,7 @@ class DatePicker {
13955
14110
  "helperText": [1, "helper-text"],
13956
14111
  "hideHelperText": [4, "hide-helper-text"],
13957
14112
  "inputId": [1, "input-id"],
14113
+ "invalidDateMessage": [1, "invalid-date-message"],
13958
14114
  "label": [1],
13959
14115
  "max": [1],
13960
14116
  "min": [1],
@@ -14959,7 +15115,7 @@ class HorizontalScroll {
14959
15115
  componentWillLoad() {
14960
15116
  this.itemsContainerEl = this.el.children[0];
14961
15117
  this.itemsContainerEl.addEventListener("scroll", this.scrollHandler);
14962
- this.items = getSlotElements$1(this.itemsContainerEl);
15118
+ this.items = getSlotElements(this.itemsContainerEl);
14963
15119
  this.items.forEach((item) => {
14964
15120
  if (item.addEventListener) {
14965
15121
  item.addEventListener(this.focusTrigger, this.focusHandler);
@@ -21640,7 +21796,7 @@ class NavigationMenu {
21640
21796
  }
21641
21797
  componentWillLoad() {
21642
21798
  this.navBarEl = document.querySelector("ic-top-navigation");
21643
- const navigationEls = getSlotContent$1(this.el, "navigation");
21799
+ const navigationEls = getSlotContent(this.el, "navigation");
21644
21800
  if (navigationEls) {
21645
21801
  this.hasNavigation = true;
21646
21802
  const lastEl = navigationEls[navigationEls.length - 1];
@@ -21652,7 +21808,7 @@ class NavigationMenu {
21652
21808
  this.navGroupFirst = true;
21653
21809
  }
21654
21810
  }
21655
- const buttonContent = getSlotContent$1(this.el, "buttons");
21811
+ const buttonContent = getSlotContent(this.el, "buttons");
21656
21812
  if (buttonContent !== null) {
21657
21813
  this.hasButtons = true;
21658
21814
  this.lastTabStop = buttonContent[buttonContent.length - 1];
@@ -21661,7 +21817,7 @@ class NavigationMenu {
21661
21817
  if (this.hasNavigation) {
21662
21818
  const lastEl = navigationEls[navigationEls.length - 1];
21663
21819
  //check for slotted content i.e. react router link
21664
- const slotContent = getSlot$1(lastEl, "navigation-item");
21820
+ const slotContent = getSlot(lastEl, "navigation-item");
21665
21821
  if (slotContent !== null) {
21666
21822
  this.lastTabStop = slotContent;
21667
21823
  }
@@ -22545,7 +22701,7 @@ class PopoverMenu {
22545
22701
  }
22546
22702
  else if (el.tagName === "IC-MENU-GROUP") {
22547
22703
  const groupSlotWrapper = el.shadowRoot.querySelector("ul");
22548
- const menuGroupElements = getSlotElements$1(groupSlotWrapper);
22704
+ const menuGroupElements = getSlotElements(groupSlotWrapper);
22549
22705
  this.addMenuItems(menuGroupElements);
22550
22706
  }
22551
22707
  }
@@ -22615,7 +22771,7 @@ class PopoverMenu {
22615
22771
  }
22616
22772
  componentDidLoad() {
22617
22773
  const slotWrapper = this.el.shadowRoot.querySelector("ul.button");
22618
- const popoverMenuElements = getSlotElements$1(slotWrapper);
22774
+ const popoverMenuElements = getSlotElements(slotWrapper);
22619
22775
  if (popoverMenuElements !== null) {
22620
22776
  this.addMenuItems(popoverMenuElements);
22621
22777
  }
@@ -26993,6 +27149,7 @@ class TextField {
26993
27149
  this.max = undefined;
26994
27150
  this.maxCharacters = 0;
26995
27151
  this.maxLength = 0;
27152
+ this.maxLengthMessage = "Maximum length exceeded";
26996
27153
  this.min = undefined;
26997
27154
  this.minCharacters = 0;
26998
27155
  this.name = this.inputId;
@@ -27084,7 +27241,7 @@ class TextField {
27084
27241
  : IcInformationStatus$1.Error
27085
27242
  : validationStatus;
27086
27243
  const currentValidationText = maxLengthExceeded
27087
- ? "Maximum length exceeded"
27244
+ ? this.maxLengthMessage
27088
27245
  : maxCharactersError
27089
27246
  ? `Maximum input is ${maxCharacters} characters`
27090
27247
  : maxValueExceeded
@@ -27172,6 +27329,7 @@ class TextField {
27172
27329
  "max": [8],
27173
27330
  "maxCharacters": [2, "max-characters"],
27174
27331
  "maxLength": [2, "max-length"],
27332
+ "maxLengthMessage": [1, "max-length-message"],
27175
27333
  "min": [8],
27176
27334
  "minCharacters": [2, "min-characters"],
27177
27335
  "name": [1],
@@ -27325,7 +27483,7 @@ class Toast {
27325
27483
  }
27326
27484
  componentDidLoad() {
27327
27485
  onComponentRequiredPropUndefined$1([{ prop: this.heading, propName: "heading" }], "Toast");
27328
- const actionContent = getSlot$1(this.el, "action");
27486
+ const actionContent = getSlot(this.el, "action");
27329
27487
  const dismissButton = this.el.shadowRoot.querySelector("ic-button");
27330
27488
  if (actionContent)
27331
27489
  this.interactiveElements.push(actionContent);
@@ -28055,7 +28213,7 @@ class TopNavigation {
28055
28213
  };
28056
28214
  this.initialiseSearchBar = () => {
28057
28215
  if (this.hasSearchSlotContent) {
28058
- const slot = getSlot$1(this.el, "search");
28216
+ const slot = getSlot(this.el, "search");
28059
28217
  if ((slot === null || slot === void 0 ? void 0 : slot.tagName) === "IC-SEARCH-BAR") {
28060
28218
  this.searchBar = slot;
28061
28219
  }