@ukic/web-components 2.3.0 → 2.4.0

package/hydrate/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 /*!
- Stencil Mock Doc v3.4.2 | MIT Licensed | https://stenciljs.com
+ Stencil Mock Doc v4.2.1 | MIT Licensed | https://stenciljs.com
  */
 const CONTENT_REF_ID = 'r';
 const ORG_LOCATION_ID = 'o';
@@ -4002,9 +4002,11 @@ class MockWindow {
     return {
       media,
       matches: false,
-      addEventListener,
-      dispatchEvent,
-      removeEventListener,
+      addListener: (_handler) => { },
+      removeListener: (_handler) => { },
+      addEventListener: (_type, _handler) => { },
+      removeEventListener: (_type, _handler) => { },
+      dispatchEvent: (_ev) => { },
       onchange: null,
     };
   }
@@ -4948,7 +4950,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
 
 
 const NAMESPACE = 'core';
-const BUILD = /* core */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: true, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: true, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
+const BUILD = /* core */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: true, connectedCallback: true, constructableCSS: false, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, patchPseudoShadowDom: false, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: true, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 
 function queryNonceMetaTagContent(e) {
  var t, o, n;
@@ -4963,8 +4965,8 @@ function forceUpdate() {}
 
 function hydrateApp(e, t, o, n, s) {
  function l() {
-  if (global.clearTimeout(p), i.clear(), r.clear(), !u) {
-   u = !0;
+  if (global.clearTimeout(p), i.clear(), r.clear(), !h) {
+   h = !0;
    try {
     t.clientHydrateAnnotations && insertVdomAnnotations(e.document, t.staticComponents), 
     e.dispatchEvent(new e.Event("DOMContentLoaded")), e.document.createElement = c, 
@@ -4979,9 +4981,9 @@ function hydrateApp(e, t, o, n, s) {
   renderCatchError(t, o, e), l();
  }
  const r = new Set, i = new Set, d = new Set, c = e.document.createElement, $ = e.document.createElementNS, m = Promise.resolve();
- let p, u = !1;
+ let p, h = !1;
  try {
-  function h() {
+  function u() {
    return g(this);
   }
   function f(e) {
@@ -4990,7 +4992,7 @@ function hydrateApp(e, t, o, n, s) {
      $tagName$: e.nodeName.toLowerCase(),
      $flags$: null
     });
-    null != t && null != t.cmpMeta && (i.add(e), e.connectedCallback = h, registerHost(e, t.cmpMeta), 
+    null != t && null != t.cmpMeta && (i.add(e), e.connectedCallback = u, registerHost(e, t.cmpMeta), 
     function o(e, t) {
      if ("function" != typeof e.componentOnReady && (e.componentOnReady = componentOnReady), 
      "function" != typeof e.forceUpdate && (e.forceUpdate = forceUpdate), 1 & t.$flags$ && (e.shadowRoot = e), 
@@ -5100,8 +5102,8 @@ function renderCatchError(e, t, o) {
   type: "build",
   header: "Hydrate Error",
   messageText: "",
-  relFilePath: null,
-  absFilePath: null,
+  relFilePath: void 0,
+  absFilePath: void 0,
   lines: []
  };
  if (e.url) try {
@@ -5251,24 +5253,23 @@ const createTime = (e, t = "") => {
 }, rootAppliedStyles = new WeakMap, registerStyle = (e, t, o) => {
  let n = styles.get(e);
  n = t, styles.set(e, n);
-}, addStyle = (e, t, o, n) => {
- var s;
- let l = getScopeId(t);
- const a = styles.get(l);
- if (e = 11 === e.nodeType ? e : doc, a) if ("string" == typeof a) {
+}, addStyle = (e, t, o) => {
+ var n;
+ const s = getScopeId(t), l = styles.get(s);
+ if (e = 11 === e.nodeType ? e : doc, l) if ("string" == typeof l) {
   e = e.head || e;
-  let o, r = rootAppliedStyles.get(e);
-  if (r || rootAppliedStyles.set(e, r = new Set), !r.has(l)) {
-   if (e.host && (o = e.querySelector(`[sty-id="${l}"]`))) o.innerHTML = a; else {
-    o = doc.createElement("style"), o.innerHTML = a;
-    const i = null !== (s = plt.$nonce$) && void 0 !== s ? s : queryNonceMetaTagContent(doc);
-    null != i && o.setAttribute("nonce", i), o.setAttribute("sty-id", l), 
-    e.insertBefore(o, e.querySelector("link"));
+  let t, o = rootAppliedStyles.get(e);
+  if (o || rootAppliedStyles.set(e, o = new Set), !o.has(s)) {
+   if (e.host && (t = e.querySelector(`[sty-id="${s}"]`))) t.innerHTML = l; else {
+    t = doc.createElement("style"), t.innerHTML = l;
+    const o = null !== (n = plt.$nonce$) && void 0 !== n ? n : queryNonceMetaTagContent(doc);
+    null != o && t.setAttribute("nonce", o), t.setAttribute("sty-id", s), 
+    e.insertBefore(t, e.querySelector("link"));
    }
-   r && r.add(l);
+   o && o.add(s);
   }
  }
- return l;
+ return s;
 }, attachStyles = e => {
  const t = e.$cmpMeta$, o = e.$hostElement$, n = t.$flags$, s = createTime("attachStyles", t.$tagName$), l = addStyle(o.getRootNode(), t);
  10 & n && (o["s-sc"] = l, 
@@ -5351,17 +5352,17 @@ const createElm = (e, t, o, n) => {
  null !== a ? (r = o["s-cr"]) ? r.parentNode.textContent = a : e.$text$ !== a && (o.data = a) : ((isSvgMode = "svg" === l || "foreignObject" !== l && isSvgMode), 
  ("slot" === l || updateElement(e, t, isSvgMode)), 
  null !== n && null !== s ? ((e, t, o, n) => {
-  let s, l, a = 0, r = 0, i = 0, d = 0, c = t.length - 1, $ = t[0], m = t[c], p = n.length - 1, u = n[0], h = n[p];
-  for (;a <= c && r <= p; ) if (null == $) $ = t[++a]; else if (null == m) m = t[--c]; else if (null == u) u = n[++r]; else if (null == h) h = n[--p]; else if (isSameVnode($, u)) patch($, u), 
-  $ = t[++a], u = n[++r]; else if (isSameVnode(m, h)) patch(m, h), m = t[--c], h = n[--p]; else if (isSameVnode($, h)) "slot" !== $.$tag$ && "slot" !== h.$tag$ || putBackInOriginalLocation($.$elm$.parentNode, !1), 
-  patch($, h), e.insertBefore($.$elm$, m.$elm$.nextSibling), $ = t[++a], h = n[--p]; else if (isSameVnode(m, u)) "slot" !== $.$tag$ && "slot" !== h.$tag$ || putBackInOriginalLocation(m.$elm$.parentNode, !1), 
-  patch(m, u), e.insertBefore(m.$elm$, $.$elm$), m = t[--c], u = n[++r]; else {
-   if (i = -1, BUILD.vdomKey) for (d = a; d <= c; ++d) if (t[d] && null !== t[d].$key$ && t[d].$key$ === u.$key$) {
+  let s, l, a = 0, r = 0, i = 0, d = 0, c = t.length - 1, $ = t[0], m = t[c], p = n.length - 1, h = n[0], u = n[p];
+  for (;a <= c && r <= p; ) if (null == $) $ = t[++a]; else if (null == m) m = t[--c]; else if (null == h) h = n[++r]; else if (null == u) u = n[--p]; else if (isSameVnode($, h)) patch($, h), 
+  $ = t[++a], h = n[++r]; else if (isSameVnode(m, u)) patch(m, u), m = t[--c], u = n[--p]; else if (isSameVnode($, u)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation($.$elm$.parentNode, !1), 
+  patch($, u), e.insertBefore($.$elm$, m.$elm$.nextSibling), $ = t[++a], u = n[--p]; else if (isSameVnode(m, h)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation(m.$elm$.parentNode, !1), 
+  patch(m, h), e.insertBefore(m.$elm$, $.$elm$), m = t[--c], h = n[++r]; else {
+   if (i = -1, BUILD.vdomKey) for (d = a; d <= c; ++d) if (t[d] && null !== t[d].$key$ && t[d].$key$ === h.$key$) {
     i = d;
     break;
    }
-   i >= 0 ? (l = t[i], l.$tag$ !== u.$tag$ ? s = createElm(t && t[r], o, i, e) : (patch(l, u), 
-   t[i] = void 0, s = l.$elm$), u = n[++r]) : (s = createElm(t && t[r], o, r, e), u = n[++r]), 
+   i >= 0 ? (l = t[i], l.$tag$ !== h.$tag$ ? s = createElm(t && t[r], o, i, e) : (patch(l, h), 
+   t[i] = void 0, s = l.$elm$), h = n[++r]) : (s = createElm(t && t[r], o, r, e), h = n[++r]), 
    s && (parentReferenceNode($.$elm$).insertBefore(s, referenceNode($.$elm$)) );
   }
   a > c ? addVnodes(e, null == n[p + 1] ? null : n[p + 1].$elm$, o, n, r, p) : r > p && removeVnodes(t, a, c);
@@ -5403,33 +5404,34 @@ const createElm = (e, t, o, n) => {
  }
 }, isNodeLocatedInSlot = (e, t) => 1 === e.nodeType ? null === e.getAttribute("slot") && "" === t || e.getAttribute("slot") === t : e["s-sn"] === t || "" === t, nullifyVNodeRefs = e => {
  (e.$attrs$ && e.$attrs$.ref && e.$attrs$.ref(null), e.$children$ && e.$children$.map(nullifyVNodeRefs));
-}, renderVdom = (e, t) => {
- const o = e.$hostElement$, n = e.$cmpMeta$, s = e.$vnode$ || newVNode(null, null), l = isHost(t) ? t : h(null, null, t);
- if (hostTagName = o.tagName, BUILD.isDev  ) ;
- if (n.$attrsToReflect$ && (l.$attrs$ = l.$attrs$ || {}, n.$attrsToReflect$.map((([e, t]) => l.$attrs$[t] = o[e]))), 
- l.$tag$ = null, l.$flags$ |= 4, e.$vnode$ = l, l.$elm$ = s.$elm$ = o.shadowRoot || o, 
- (scopeId = o["s-sc"]), (contentRef = o["s-cr"], 
- useNativeShadowDom = supportsShadow, checkSlotFallbackVisibility = !1), patch(s, l), 
+}, renderVdom = (e, t, o = !1) => {
+ const n = e.$hostElement$, s = e.$cmpMeta$, l = e.$vnode$ || newVNode(null, null), a = isHost(t) ? t : h(null, null, t);
+ if (hostTagName = n.tagName, BUILD.isDev  ) ;
+ if (s.$attrsToReflect$ && (a.$attrs$ = a.$attrs$ || {}, s.$attrsToReflect$.map((([e, t]) => a.$attrs$[t] = n[e]))), 
+ o && a.$attrs$) for (const e of Object.keys(a.$attrs$)) n.hasAttribute(e) && ![ "key", "ref", "style", "class" ].includes(e) && (a.$attrs$[e] = n[e]);
+ if (a.$tag$ = null, a.$flags$ |= 4, e.$vnode$ = a, a.$elm$ = l.$elm$ = n.shadowRoot || n, 
+ (scopeId = n["s-sc"]), (contentRef = n["s-cr"], 
+ useNativeShadowDom = supportsShadow, checkSlotFallbackVisibility = !1), patch(l, a), 
  BUILD.slotRelocation) {
   if (plt.$flags$ |= 1, checkSlotRelocate) {
-   let e, t, o, n, s, a;
-   relocateSlotContent(l.$elm$);
+   let e, t, o, n, s, l;
+   relocateSlotContent(a.$elm$);
    let r = 0;
    for (;r < relocateNodes.length; r++) e = relocateNodes[r], t = e.$nodeToRelocate$, 
    t["s-ol"] || (o = originalLocationDebugNode(t) , 
    o["s-nr"] = t, t.parentNode.insertBefore(t["s-ol"] = o, t));
    for (r = 0; r < relocateNodes.length; r++) if (e = relocateNodes[r], t = e.$nodeToRelocate$, 
    e.$slotRefNode$) {
-    for (n = e.$slotRefNode$.parentNode, s = e.$slotRefNode$.nextSibling, o = t["s-ol"]; o = o.previousSibling; ) if (a = o["s-nr"], 
-    a && a["s-sn"] === t["s-sn"] && n === a.parentNode && (a = a.nextSibling, !a || !a["s-nr"])) {
-     s = a;
+    for (n = e.$slotRefNode$.parentNode, s = e.$slotRefNode$.nextSibling, o = t["s-ol"]; o = o.previousSibling; ) if (l = o["s-nr"], 
+    l && l["s-sn"] === t["s-sn"] && n === l.parentNode && (l = l.nextSibling, !l || !l["s-nr"])) {
+     s = l;
      break;
     }
     (!s && n !== t.parentNode || t.nextSibling !== s) && t !== s && (!t["s-hn"] && t["s-ol"] && (t["s-hn"] = t["s-ol"].parentNode.nodeName), 
     n.insertBefore(t, s));
    } else 1 === t.nodeType && (t.hidden = !0);
   }
-  checkSlotFallbackVisibility && updateFallbackSlotVisibility(l.$elm$), plt.$flags$ &= -2, 
+  checkSlotFallbackVisibility && updateFallbackSlotVisibility(a.$elm$), plt.$flags$ &= -2, 
   relocateNodes.length = 0;
  }
 }, slotReferenceDebugNode = e => doc.createComment(`<slot${e.$name$ ? ' name="' + e.$name$ + '"' : ""}> (host=${hostTagName.toLowerCase()})`), originalLocationDebugNode = e => doc.createComment("org-location for " + (e.localName ? `<${e.localName}> (host=${e["s-hn"]})` : `[${e.textContent}]`)), attachToAncestor = (e, t) => {
@@ -5450,7 +5452,7 @@ const createElm = (e, t, o, n) => {
  const s = e.$hostElement$, l = createTime("update", e.$cmpMeta$.$tagName$), a = s["s-rc"];
  o && attachStyles(e);
  const r = createTime("render", e.$cmpMeta$.$tagName$);
- if (await callRender(e, t) , 
+ if (await callRender(e, t, s, o) , 
  BUILD.hydrateServerSide) try {
   serverSideConnected(s), o && (1 & e.$cmpMeta$.$flags$ ? s["s-en"] = "" : 2 & e.$cmpMeta$.$flags$ && (s["s-en"] = "c"));
  } catch (e) {
@@ -5463,11 +5465,11 @@ const createElm = (e, t, o, n) => {
  }
 };
 
-const callRender = (e, t, o) => {
+const callRender = (e, t, o, n) => {
  try {
   if (t = t.render(), (e.$flags$ &= -17), 
   (e.$flags$ |= 2), BUILD.hasRenderFn ) {
-   return Promise.resolve(t).then((t => renderVdom(e, t)));
+   return Promise.resolve(t).then((t => renderVdom(e, t, n)));
   }
  } catch (t) {
   consoleError(t, e.$hostElement$);
@@ -5591,7 +5593,7 @@ const callRender = (e, t, o) => {
 }, connectedCallback = e => {
  if (0 == (1 & plt.$flags$)) {
   const t = getHostRef(e), o = t.$cmpMeta$, n = createTime("connectedCallback", o.$tagName$);
-  if (1 & t.$flags$) addHostEventListeners(e, t, o.$listeners$), fireConnectedCallback(t.$lazyInstance$); else {
+  if (1 & t.$flags$) addHostEventListeners(e, t, o.$listeners$), (null == t ? void 0 : t.$lazyInstance$) ? fireConnectedCallback(t.$lazyInstance$) : (null == t ? void 0 : t.$onReadyPromise$) && t.$onReadyPromise$.then((() => fireConnectedCallback(t.$lazyInstance$))); else {
    let n;
    if (t.$flags$ |= 1, (n = e.getAttribute("s-id"), n)) {
     ((e, t, o, n) => {
@@ -6057,8 +6059,13 @@ const isEmptyString = (value) => {
  * @param options - list of menu items
  * @returns - label corresponding to value
  */
-const getLabelFromValue = (value, options) => {
-  var _a;
+const getLabelFromValue = (value, options, valueField, labelField) => {
+  if (valueField === undefined) {
+    valueField = "value";
+  }
+  if (labelField === undefined) {
+    labelField = "label";
+  }
   const ungroupedOptions = [];
   if (options.length > 0 && options.map) {
     options.map((option) => {
@@ -6069,7 +6076,10 @@ const getLabelFromValue = (value, options) => {
         ungroupedOptions.push(option);
       }
     });
-    return (_a = ungroupedOptions.find((option) => option.value === value)) === null || _a === void 0 ? void 0 : _a.label;
+    if (ungroupedOptions.find((option) => option[valueField] === value) !==
+      undefined) {
+      return ungroupedOptions.find((option) => option[valueField] === value)[labelField];
+    }
   }
   return undefined;
 };
@@ -6081,17 +6091,24 @@ const getLabelFromValue = (value, options) => {
  * @param position - whether the search string matches the start of or anywhere in the options
  * @returns filtered array of options
  */
-const getFilteredMenuOptions = (options, includeDescriptions, searchString, position) => {
+const getFilteredMenuOptions = (options, includeDescriptions, searchString, position, labelField) => {
   let rawFilteredOptions;
+  if (labelField === undefined) {
+    labelField = "label";
+  }
   if (position === "anywhere") {
     rawFilteredOptions = options.filter((option) => {
       var _a;
       if (includeDescriptions) {
-        return (option.label.toLowerCase().includes(searchString.toLowerCase()) ||
+        return (option[labelField]
+          .toLowerCase()
+          .includes(searchString.toLowerCase()) ||
           ((_a = option.description) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(searchString.toLowerCase())));
       }
       else {
-        return option.label.toLowerCase().includes(searchString.toLowerCase());
+        return option[labelField]
+          .toLowerCase()
+          .includes(searchString.toLowerCase());
       }
     });
   }
@@ -6099,11 +6116,13 @@ const getFilteredMenuOptions = (options, includeDescriptions, searchString, posi
     rawFilteredOptions = options.filter((option) => {
       var _a;
       if (includeDescriptions) {
-        return (option.label.toLowerCase().startsWith(searchString.toLowerCase()) ||
+        return (option[labelField]
+          .toLowerCase()
+          .startsWith(searchString.toLowerCase()) ||
           ((_a = option.description) === null || _a === void 0 ? void 0 : _a.toLowerCase().startsWith(searchString.toLowerCase())));
       }
       else {
-        return option.label
+        return option[labelField]
           .toLowerCase()
           .startsWith(searchString.toLowerCase());
       }
@@ -6577,6 +6596,9 @@ var backIcon = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/20
 
 const icBreadcrumbCss = "/*!@:host*/.sc-ic-breadcrumb-h{display:block;margin:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}/*!@:host .breadcrumb*/.sc-ic-breadcrumb-h .breadcrumb.sc-ic-breadcrumb{display:flex;align-items:center;white-space:nowrap;gap:var(--ic-space-xs);min-height:var(--ic-space-lg)}/*!@:host .chevron*/.sc-ic-breadcrumb-h .chevron.sc-ic-breadcrumb{width:var(--ic-space-lg);height:var(--ic-space-lg)}/*!@:host .chevron svg*/.sc-ic-breadcrumb-h .chevron.sc-ic-breadcrumb svg.sc-ic-breadcrumb{color:var(--ic-architectural-400)}/*!@:host(:first-child) .chevron*/.sc-ic-breadcrumb-h:first-child .chevron.sc-ic-breadcrumb{display:none}/*!@.back-icon svg*/.back-icon.sc-ic-breadcrumb svg.sc-ic-breadcrumb{color:var(--ic-hyperlink)}/*!@:host(.back)*/.back.sc-ic-breadcrumb-h{display:flex;align-items:center}/*!@:host(.back) .chevron*/.back.sc-ic-breadcrumb-h .chevron.sc-ic-breadcrumb{display:none}/*!@ic-link*/ic-link.sc-ic-breadcrumb{--breadcrumb-link-display:inline-flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}/*!@:host([aria-current=\"page\"]) .current-page-container*/[aria-current=\"page\"].sc-ic-breadcrumb-h .current-page-container.sc-ic-breadcrumb{display:flex;align-items:center;gap:var(--ic-space-xs)}/*!@:host(.collapsed-breadcrumb-wrapper)*/.collapsed-breadcrumb-wrapper.sc-ic-breadcrumb-h{margin-right:var(--ic-space-xs) !important;display:flex;align-items:center;gap:var(--ic-space-xs)}/*!@:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb)*/.sc-ic-breadcrumb-h.collapsed-breadcrumb-wrapper .sc-ic-breadcrumb-s>.collapsed-breadcrumb{border:none;background-color:transparent;color:var(--ic-hyperlink);text-decoration:underline;font-weight:var(--ic-font-weight-bold);cursor:pointer}/*!@:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus)*/.sc-ic-breadcrumb-h.collapsed-breadcrumb-wrapper .sc-ic-breadcrumb-s>.collapsed-breadcrumb:hover,.sc-ic-breadcrumb-h.collapsed-breadcrumb-wrapper .sc-ic-breadcrumb-s>.collapsed-breadcrumb:focus{outline:var(--ic-hc-focus-outline);border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}/*!@.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide)*/.hide.sc-ic-breadcrumb,.sc-ic-breadcrumb-h.collapsed-breadcrumb-wrapper .sc-ic-breadcrumb-s>.hide{display:none}@media (forced-colors: active){/*!@.back-icon svg*/.back-icon.sc-ic-breadcrumb svg.sc-ic-breadcrumb{color:currentcolor}}@supports (text-decoration-thickness: 25%){/*!@ic-link*/ic-link.sc-ic-breadcrumb{--breadcrumb-link-display:flex}/*!@:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus)*/.sc-ic-breadcrumb-h.collapsed-breadcrumb-wrapper .sc-ic-breadcrumb-s>.collapsed-breadcrumb:hover,.sc-ic-breadcrumb-h.collapsed-breadcrumb-wrapper .sc-ic-breadcrumb-s>.collapsed-breadcrumb:focus{text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}";
 
+/**
+ * @slot icon - Content will be rendered to the left of the breadcrumb page title.
+ */
 class Breadcrumb {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -7732,6 +7754,11 @@ class DataRow {
 
 const icDialogCss = "/*!@html*/html.sc-ic-dialog{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-dialog{margin:0}/*!@main*/main.sc-ic-dialog{display:block}/*!@h1*/h1.sc-ic-dialog{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-dialog{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-dialog{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-dialog{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-dialog{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-dialog,strong.sc-ic-dialog{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-dialog,kbd.sc-ic-dialog,samp.sc-ic-dialog{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-dialog{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-dialog,sup.sc-ic-dialog{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-dialog{bottom:-0.25em}/*!@sup*/sup.sc-ic-dialog{top:-0.5em}/*!@img*/img.sc-ic-dialog{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-dialog,input.sc-ic-dialog,optgroup.sc-ic-dialog,select.sc-ic-dialog,textarea.sc-ic-dialog{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-dialog,input.sc-ic-dialog{overflow:visible}/*!@button,\nselect*/button.sc-ic-dialog,select.sc-ic-dialog{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-dialog,[type=\"button\"].sc-ic-dialog,[type=\"reset\"].sc-ic-dialog,[type=\"submit\"].sc-ic-dialog{-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-dialog::-moz-focus-inner,[type=\"button\"].sc-ic-dialog::-moz-focus-inner,[type=\"reset\"].sc-ic-dialog::-moz-focus-inner,[type=\"submit\"].sc-ic-dialog::-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-dialog:-moz-focusring,[type=\"button\"].sc-ic-dialog:-moz-focusring,[type=\"reset\"].sc-ic-dialog:-moz-focusring,[type=\"submit\"].sc-ic-dialog:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-dialog{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-dialog{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-dialog{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-dialog{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-dialog,[type=\"radio\"].sc-ic-dialog{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-dialog::-webkit-inner-spin-button,[type=\"number\"].sc-ic-dialog::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-dialog{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-dialog::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-dialog::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-dialog{display:block}/*!@summary*/summary.sc-ic-dialog{display:list-item}/*!@template*/template.sc-ic-dialog{display:none}/*!@[hidden]*/[hidden].sc-ic-dialog{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-dialog,body.sc-ic-dialog,div.sc-ic-dialog,span.sc-ic-dialog,applet.sc-ic-dialog,object.sc-ic-dialog,iframe.sc-ic-dialog,h1.sc-ic-dialog,h2.sc-ic-dialog,h3.sc-ic-dialog,h4.sc-ic-dialog,h5.sc-ic-dialog,h6.sc-ic-dialog,p.sc-ic-dialog,blockquote.sc-ic-dialog,pre.sc-ic-dialog,a.sc-ic-dialog,abbr.sc-ic-dialog,acronym.sc-ic-dialog,address.sc-ic-dialog,big.sc-ic-dialog,cite.sc-ic-dialog,code.sc-ic-dialog,del.sc-ic-dialog,dfn.sc-ic-dialog,em.sc-ic-dialog,img.sc-ic-dialog,ins.sc-ic-dialog,kbd.sc-ic-dialog,q.sc-ic-dialog,s.sc-ic-dialog,samp.sc-ic-dialog,small.sc-ic-dialog,strike.sc-ic-dialog,strong.sc-ic-dialog,sub.sc-ic-dialog,sup.sc-ic-dialog,tt.sc-ic-dialog,var.sc-ic-dialog,b.sc-ic-dialog,u.sc-ic-dialog,i.sc-ic-dialog,center.sc-ic-dialog,dl.sc-ic-dialog,dt.sc-ic-dialog,dd.sc-ic-dialog,ol.sc-ic-dialog,ul.sc-ic-dialog,li.sc-ic-dialog,fieldset.sc-ic-dialog,form.sc-ic-dialog,label.sc-ic-dialog,legend.sc-ic-dialog,table.sc-ic-dialog,caption.sc-ic-dialog,tbody.sc-ic-dialog,tfoot.sc-ic-dialog,thead.sc-ic-dialog,tr.sc-ic-dialog,th.sc-ic-dialog,td.sc-ic-dialog,article.sc-ic-dialog,aside.sc-ic-dialog,canvas.sc-ic-dialog,details.sc-ic-dialog,embed.sc-ic-dialog,figure.sc-ic-dialog,figcaption.sc-ic-dialog,footer.sc-ic-dialog,header.sc-ic-dialog,hgroup.sc-ic-dialog,menu.sc-ic-dialog,nav.sc-ic-dialog,output.sc-ic-dialog,ruby.sc-ic-dialog,section.sc-ic-dialog,summary.sc-ic-dialog,time.sc-ic-dialog,mark.sc-ic-dialog,audio.sc-ic-dialog,video.sc-ic-dialog{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@:host*/.sc-ic-dialog-h{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;min-height:100% !important;background:rgb(0 0 0 / 60%);z-index:var(--ic-z-index-dialog);opacity:0;transition:opacity var(--ic-easing-transition-slow)}/*!@:host(.fade-in)*/.fade-in.sc-ic-dialog-h{opacity:1;transition:opacity var(--ic-easing-transition-slow)}/*!@:host(.hidden)*/.hidden.sc-ic-dialog-h{display:none}/*!@.dialog*/.dialog.sc-ic-dialog{background-color:var(--ic-architectural-white);border:var(--ic-border-default);border-radius:var(--ic-border-radius);padding:var(--ic-space-xs) var(--ic-space-md);transform:translateY(-3rem);transition:transform 1000s;display:flex;flex-direction:column;box-sizing:border-box}/*!@:host(.fade-in) .dialog*/.fade-in.sc-ic-dialog-h .dialog.sc-ic-dialog{transform:translateY(0);transition:transform var(--ic-easing-transition-slow)}/*!@.small*/.small.sc-ic-dialog{width:50%;max-width:25rem;min-height:11rem;max-height:70vh}/*!@.medium*/.medium.sc-ic-dialog{width:70vw;max-width:44rem;min-height:12.5rem;max-height:70vh}/*!@.large*/.large.sc-ic-dialog{width:90vw;max-width:62.5rem;min-height:12.5rem;max-height:90vh}/*!@.heading-area*/.heading-area.sc-ic-dialog{display:flex;margin-bottom:var(--ic-space-xs)}/*!@.close-icon*/.close-icon.sc-ic-dialog{margin-left:auto}/*!@.close-icon-svg*/.close-icon-svg.sc-ic-dialog{display:flex;align-items:center}/*!@.content-area*/.content-area.sc-ic-dialog{-ms-overflow-style:none;scrollbar-width:none;padding:0 var(--ic-space-xs);margin:0 calc(-1 * var(--ic-space-xs))}/*!@:host([data-overflow=\"false\"]) .content-area*/[data-overflow=\"false\"].sc-ic-dialog-h .content-area.sc-ic-dialog{overflow-y:visible}/*!@:host([data-overflow=\"true\"]) .content-area*/[data-overflow=\"true\"].sc-ic-dialog-h .content-area.sc-ic-dialog{overflow-y:scroll}/*!@:host([data-overflow=\"false\"]) .dialog*/[data-overflow=\"false\"].sc-ic-dialog-h .dialog.sc-ic-dialog{overflow:visible}/*!@.content-area::-webkit-scrollbar*/.content-area.sc-ic-dialog::-webkit-scrollbar{display:none}/*!@#dialog-content*/#dialog-content.sc-ic-dialog{margin-bottom:var(--ic-space-sm)}/*!@.status-alert*/.status-alert.sc-ic-dialog{margin-bottom:var(--ic-space-xs)}/*!@.dialog-controls*/.dialog-controls.sc-ic-dialog{margin-top:auto;padding-top:var(--ic-space-xs);display:flex;justify-content:flex-end;gap:var(--ic-space-md)}/*!@.dialog-control-button*/.dialog-control-button.sc-ic-dialog{width:-moz-fit-content;width:fit-content}@media (min-width: 800px){/*!@:host([size=\"large\"]) .content-area*/[size=\"large\"].sc-ic-dialog-h .content-area.sc-ic-dialog{width:75%}}@media (max-width: 576px){/*!@.dialog*/.dialog.sc-ic-dialog{width:100vw;height:100vh;transform:translateY(-5rem);max-width:none;max-height:none;box-sizing:border-box}}@media (max-width: 364px){/*!@.triple-button*/.triple-button.sc-ic-dialog{flex-direction:column;gap:var(--ic-space-xs)}/*!@.dialog-control-button*/.dialog-control-button.sc-ic-dialog{width:unset}}";
 
+/**
+ * @slot dialog-controls - Content will be place at the bottom of the dialog.
+ * @slot heading - Content will be placed at the top of the dialog.
+ * @slot label - Content will be placed above the dialog heading.
+ */
 class Dialog {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -10924,7 +10951,7 @@ var checkIcon = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2
 </svg>
 `;
 
-const icMenuCss = "html.sc-ic-menu{line-height:1.15;-webkit-text-size-adjust:100%}body.sc-ic-menu{margin:0}main.sc-ic-menu{display:block}h1.sc-ic-menu{font-size:2em;margin:0.67em 0}hr.sc-ic-menu{box-sizing:content-box;height:0;overflow:visible}pre.sc-ic-menu{font-family:monospace, monospace;font-size:1em}a.sc-ic-menu{background-color:transparent}abbr[title].sc-ic-menu{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b.sc-ic-menu,strong.sc-ic-menu{font-weight:bolder}code.sc-ic-menu,kbd.sc-ic-menu,samp.sc-ic-menu{font-family:monospace, monospace;font-size:1em}small.sc-ic-menu{font-size:80%}sub.sc-ic-menu,sup.sc-ic-menu{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub.sc-ic-menu{bottom:-0.25em}sup.sc-ic-menu{top:-0.5em}img.sc-ic-menu{border-style:none}button.sc-ic-menu,input.sc-ic-menu,optgroup.sc-ic-menu,select.sc-ic-menu,textarea.sc-ic-menu{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button.sc-ic-menu,input.sc-ic-menu{overflow:visible}button.sc-ic-menu,select.sc-ic-menu{text-transform:none}button.sc-ic-menu,[type=\"button\"].sc-ic-menu,[type=\"reset\"].sc-ic-menu,[type=\"submit\"].sc-ic-menu{-webkit-appearance:button}button.sc-ic-menu::-moz-focus-inner,[type=\"button\"].sc-ic-menu::-moz-focus-inner,[type=\"reset\"].sc-ic-menu::-moz-focus-inner,[type=\"submit\"].sc-ic-menu::-moz-focus-inner{border-style:none;padding:0}button.sc-ic-menu:-moz-focusring,[type=\"button\"].sc-ic-menu:-moz-focusring,[type=\"reset\"].sc-ic-menu:-moz-focusring,[type=\"submit\"].sc-ic-menu:-moz-focusring{outline:1px dotted ButtonText}fieldset.sc-ic-menu{padding:0.35em 0.75em 0.625em}legend.sc-ic-menu{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress.sc-ic-menu{vertical-align:baseline}textarea.sc-ic-menu{overflow:auto}[type=\"checkbox\"].sc-ic-menu,[type=\"radio\"].sc-ic-menu{box-sizing:border-box;padding:0}[type=\"number\"].sc-ic-menu::-webkit-inner-spin-button,[type=\"number\"].sc-ic-menu::-webkit-outer-spin-button{height:auto}[type=\"search\"].sc-ic-menu{-webkit-appearance:textfield;outline-offset:-2px}[type=\"search\"].sc-ic-menu::-webkit-search-decoration{-webkit-appearance:none}.sc-ic-menu::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details.sc-ic-menu{display:block}summary.sc-ic-menu{display:list-item}template.sc-ic-menu{display:none}[hidden].sc-ic-menu{display:none}html.sc-ic-menu,body.sc-ic-menu,div.sc-ic-menu,span.sc-ic-menu,applet.sc-ic-menu,object.sc-ic-menu,iframe.sc-ic-menu,h1.sc-ic-menu,h2.sc-ic-menu,h3.sc-ic-menu,h4.sc-ic-menu,h5.sc-ic-menu,h6.sc-ic-menu,p.sc-ic-menu,blockquote.sc-ic-menu,pre.sc-ic-menu,a.sc-ic-menu,abbr.sc-ic-menu,acronym.sc-ic-menu,address.sc-ic-menu,big.sc-ic-menu,cite.sc-ic-menu,code.sc-ic-menu,del.sc-ic-menu,dfn.sc-ic-menu,em.sc-ic-menu,img.sc-ic-menu,ins.sc-ic-menu,kbd.sc-ic-menu,q.sc-ic-menu,s.sc-ic-menu,samp.sc-ic-menu,small.sc-ic-menu,strike.sc-ic-menu,strong.sc-ic-menu,sub.sc-ic-menu,sup.sc-ic-menu,tt.sc-ic-menu,var.sc-ic-menu,b.sc-ic-menu,u.sc-ic-menu,i.sc-ic-menu,center.sc-ic-menu,dl.sc-ic-menu,dt.sc-ic-menu,dd.sc-ic-menu,ol.sc-ic-menu,ul.sc-ic-menu,li.sc-ic-menu,fieldset.sc-ic-menu,form.sc-ic-menu,label.sc-ic-menu,legend.sc-ic-menu,table.sc-ic-menu,caption.sc-ic-menu,tbody.sc-ic-menu,tfoot.sc-ic-menu,thead.sc-ic-menu,tr.sc-ic-menu,th.sc-ic-menu,td.sc-ic-menu,article.sc-ic-menu,aside.sc-ic-menu,canvas.sc-ic-menu,details.sc-ic-menu,embed.sc-ic-menu,figure.sc-ic-menu,figcaption.sc-ic-menu,footer.sc-ic-menu,header.sc-ic-menu,hgroup.sc-ic-menu,menu.sc-ic-menu,nav.sc-ic-menu,output.sc-ic-menu,ruby.sc-ic-menu,section.sc-ic-menu,summary.sc-ic-menu,time.sc-ic-menu,mark.sc-ic-menu,audio.sc-ic-menu,video.sc-ic-menu{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){.open.sc-ic-menu-h .menu.sc-ic-menu{transition:max-height var(--ic-transition-duration-slow)}}.sc-ic-menu-h{border-radius:var(--ic-border-radius);max-height:0;width:var(--input-width, 20rem);color:var(--ic-color-primary-text);background-color:var(--ic-architectural-white);position:relative;z-index:var(--ic-z-index-menu);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay)}.sc-ic-menu-h:not(.no-focus):focus-within{box-shadow:var(--ic-border-focus)}#retry-button.sc-ic-menu::part(button){height:var(--ic-space-lg)}.small.sc-ic-menu #retry-button.sc-ic-menu::part(button){height:var(--ic-space-md)}.on-dialog.sc-ic-menu-h{inset:auto !important}.on-dialog-fix-translate.sc-ic-menu-h{transform:translate(0, 80px) !important}.menu.sc-ic-menu{text-decoration:none;list-style-type:none;border:var(--ic-space-1px) solid var(--ic-architectural-400);border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu-scroll.sc-ic-menu{overflow-y:auto}.menu.sc-ic-menu:focus-visible{outline:none}.open.sc-ic-menu-h{max-height:none;display:block}.open.sc-ic-menu-h .menu.sc-ic-menu{visibility:visible;max-height:20.125rem}.full-width.sc-ic-menu-h{width:100%}.option.sc-ic-menu{padding:0.5rem 0.438rem;cursor:pointer;display:flex;align-items:center}.option.sc-ic-menu:not(.loading-option){justify-content:space-between}.small.sc-ic-menu-h .option.sc-ic-menu{padding:0.25rem 0.438rem}.option.sc-ic-menu:last-child{border-radius:0 0 var(--ic-space-1px) var(--ic-space-1px)}.option.sc-ic-menu:first-child{border-radius:var(--ic-space-1px) var(--ic-space-1px) 0 0}.option.sc-ic-menu:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option.sc-ic-menu:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option.sc-ic-menu:focus-visible{outline:var(--ic-hc-focus-outline)}.option.sc-ic-menu:not(.disabled-option) .option-description.sc-ic-menu{color:var(--ic-color-secondary-text)}.option-text-container.sc-ic-menu{pointer-events:none}.option.loading-option.sc-ic-menu .option-text-container.sc-ic-menu{margin-left:0.625rem;color:var(--ic-color-secondary-text)}.error-icon-svg.sc-ic-menu{height:var(--ic-space-md);width:var(--ic-space-md);fill:var(--ic-status-error);align-self:center;display:flex;margin-right:calc(var(--ic-space-xxs) * 1.2)}.loading-error-info.sc-ic-menu{display:flex}.check-icon.sc-ic-menu{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:0.5rem;pointer-events:none}.focused-option.sc-ic-menu .check-icon.sc-ic-menu *.sc-ic-menu{fill:currentcolor}.option-group-title.sc-ic-menu{padding:1.5rem 0.438rem 0.5rem;color:var(--ic-color-tertiary-text)}.small.sc-ic-menu-h .option-group-title.sc-ic-menu{padding:0.75rem 0.438rem 0.25rem}.last-recommended-option.sc-ic-menu{border-bottom:var(--ic-border-default)}.disabled-option.sc-ic-menu{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option.sc-ic-menu,.focused-option.sc-ic-menu .option-description.sc-ic-menu{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}.no-results.sc-ic-menu-h li.sc-ic-menu{cursor:no-drop}.no-results.sc-ic-menu-h li.sc-ic-menu:hover{background-color:transparent}@media (forced-colors: active){.focused-option.sc-ic-menu:focus{outline:none;border:0.125rem solid transparent}}";
+const icMenuCss = "html.sc-ic-menu{line-height:1.15;-webkit-text-size-adjust:100%}body.sc-ic-menu{margin:0}main.sc-ic-menu{display:block}h1.sc-ic-menu{font-size:2em;margin:0.67em 0}hr.sc-ic-menu{box-sizing:content-box;height:0;overflow:visible}pre.sc-ic-menu{font-family:monospace, monospace;font-size:1em}a.sc-ic-menu{background-color:transparent}abbr[title].sc-ic-menu{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b.sc-ic-menu,strong.sc-ic-menu{font-weight:bolder}code.sc-ic-menu,kbd.sc-ic-menu,samp.sc-ic-menu{font-family:monospace, monospace;font-size:1em}small.sc-ic-menu{font-size:80%}sub.sc-ic-menu,sup.sc-ic-menu{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub.sc-ic-menu{bottom:-0.25em}sup.sc-ic-menu{top:-0.5em}img.sc-ic-menu{border-style:none}button.sc-ic-menu,input.sc-ic-menu,optgroup.sc-ic-menu,select.sc-ic-menu,textarea.sc-ic-menu{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button.sc-ic-menu,input.sc-ic-menu{overflow:visible}button.sc-ic-menu,select.sc-ic-menu{text-transform:none}button.sc-ic-menu,[type=\"button\"].sc-ic-menu,[type=\"reset\"].sc-ic-menu,[type=\"submit\"].sc-ic-menu{-webkit-appearance:button}button.sc-ic-menu::-moz-focus-inner,[type=\"button\"].sc-ic-menu::-moz-focus-inner,[type=\"reset\"].sc-ic-menu::-moz-focus-inner,[type=\"submit\"].sc-ic-menu::-moz-focus-inner{border-style:none;padding:0}button.sc-ic-menu:-moz-focusring,[type=\"button\"].sc-ic-menu:-moz-focusring,[type=\"reset\"].sc-ic-menu:-moz-focusring,[type=\"submit\"].sc-ic-menu:-moz-focusring{outline:1px dotted ButtonText}fieldset.sc-ic-menu{padding:0.35em 0.75em 0.625em}legend.sc-ic-menu{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress.sc-ic-menu{vertical-align:baseline}textarea.sc-ic-menu{overflow:auto}[type=\"checkbox\"].sc-ic-menu,[type=\"radio\"].sc-ic-menu{box-sizing:border-box;padding:0}[type=\"number\"].sc-ic-menu::-webkit-inner-spin-button,[type=\"number\"].sc-ic-menu::-webkit-outer-spin-button{height:auto}[type=\"search\"].sc-ic-menu{-webkit-appearance:textfield;outline-offset:-2px}[type=\"search\"].sc-ic-menu::-webkit-search-decoration{-webkit-appearance:none}.sc-ic-menu::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details.sc-ic-menu{display:block}summary.sc-ic-menu{display:list-item}template.sc-ic-menu{display:none}[hidden].sc-ic-menu{display:none}html.sc-ic-menu,body.sc-ic-menu,div.sc-ic-menu,span.sc-ic-menu,applet.sc-ic-menu,object.sc-ic-menu,iframe.sc-ic-menu,h1.sc-ic-menu,h2.sc-ic-menu,h3.sc-ic-menu,h4.sc-ic-menu,h5.sc-ic-menu,h6.sc-ic-menu,p.sc-ic-menu,blockquote.sc-ic-menu,pre.sc-ic-menu,a.sc-ic-menu,abbr.sc-ic-menu,acronym.sc-ic-menu,address.sc-ic-menu,big.sc-ic-menu,cite.sc-ic-menu,code.sc-ic-menu,del.sc-ic-menu,dfn.sc-ic-menu,em.sc-ic-menu,img.sc-ic-menu,ins.sc-ic-menu,kbd.sc-ic-menu,q.sc-ic-menu,s.sc-ic-menu,samp.sc-ic-menu,small.sc-ic-menu,strike.sc-ic-menu,strong.sc-ic-menu,sub.sc-ic-menu,sup.sc-ic-menu,tt.sc-ic-menu,var.sc-ic-menu,b.sc-ic-menu,u.sc-ic-menu,i.sc-ic-menu,center.sc-ic-menu,dl.sc-ic-menu,dt.sc-ic-menu,dd.sc-ic-menu,ol.sc-ic-menu,ul.sc-ic-menu,li.sc-ic-menu,fieldset.sc-ic-menu,form.sc-ic-menu,label.sc-ic-menu,legend.sc-ic-menu,table.sc-ic-menu,caption.sc-ic-menu,tbody.sc-ic-menu,tfoot.sc-ic-menu,thead.sc-ic-menu,tr.sc-ic-menu,th.sc-ic-menu,td.sc-ic-menu,article.sc-ic-menu,aside.sc-ic-menu,canvas.sc-ic-menu,details.sc-ic-menu,embed.sc-ic-menu,figure.sc-ic-menu,figcaption.sc-ic-menu,footer.sc-ic-menu,header.sc-ic-menu,hgroup.sc-ic-menu,menu.sc-ic-menu,nav.sc-ic-menu,output.sc-ic-menu,ruby.sc-ic-menu,section.sc-ic-menu,summary.sc-ic-menu,time.sc-ic-menu,mark.sc-ic-menu,audio.sc-ic-menu,video.sc-ic-menu{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){.open.sc-ic-menu-h .menu.sc-ic-menu{transition:max-height var(--ic-transition-duration-slow)}}.sc-ic-menu-h{border-radius:var(--ic-border-radius);max-height:0;width:var(--input-width, 20rem);color:var(--ic-color-primary-text);background-color:var(--ic-architectural-white);position:relative;z-index:var(--ic-z-index-menu);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay)}.sc-ic-menu-h:not(.no-focus):focus-within{box-shadow:var(--ic-border-focus)}#retry-button.sc-ic-menu::part(button){height:var(--ic-space-lg)}.small.sc-ic-menu #retry-button.sc-ic-menu::part(button){height:var(--ic-space-md)}.on-dialog.sc-ic-menu-h{inset:auto !important}.on-dialog-fix-translate.sc-ic-menu-h{transform:translate(0, 80px) !important}.menu.sc-ic-menu{text-decoration:none;list-style-type:none;border:var(--ic-space-1px) solid var(--ic-architectural-400);border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu-scroll.sc-ic-menu{overflow-y:auto}.menu.sc-ic-menu:focus-visible{outline:none}.open.sc-ic-menu-h{max-height:none;display:block}.open.sc-ic-menu-h .menu.sc-ic-menu{visibility:visible;max-height:20.125rem}.full-width.sc-ic-menu-h{width:100%}.option.sc-ic-menu{padding:0.5rem 0.438rem;cursor:pointer;display:flex;align-items:center}.option.sc-ic-menu:not(.loading-option){justify-content:space-between}.small.sc-ic-menu-h .option.sc-ic-menu{padding:0.25rem 0.438rem}.option.sc-ic-menu:last-child{border-radius:0 0 var(--ic-space-1px) var(--ic-space-1px)}.option.sc-ic-menu:first-child{border-radius:var(--ic-space-1px) var(--ic-space-1px) 0 0}.option.sc-ic-menu:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option.sc-ic-menu:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option.sc-ic-menu:focus-visible{outline:var(--ic-hc-focus-outline)}.option.sc-ic-menu:not(.disabled-option) .option-description.sc-ic-menu{color:var(--ic-color-secondary-text)}.option.sc-ic-menu .option-label.sc-ic-menu{display:flex;flex-direction:row;align-items:top}.option.sc-ic-menu .option-element.sc-ic-menu{margin-top:var(--ic-space-xxs)}.option.sc-ic-menu .option-icon.sc-ic-menu{height:var(--ic-space-md);width:var(--ic-space-md);margin-top:var(--ic-space-xxs);margin-right:var(--ic-space-xxxs)}.option-text-container.sc-ic-menu{pointer-events:none}.option.loading-option.sc-ic-menu .option-text-container.sc-ic-menu{margin-left:0.625rem;color:var(--ic-color-secondary-text)}.error-icon-svg.sc-ic-menu{height:var(--ic-space-md);width:var(--ic-space-md);fill:var(--ic-status-error);align-self:center;display:flex;margin-right:calc(var(--ic-space-xxs) * 1.2)}.loading-error-info.sc-ic-menu{display:flex}.check-icon.sc-ic-menu{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:0.5rem;pointer-events:none}.focused-option.sc-ic-menu .check-icon.sc-ic-menu *.sc-ic-menu{fill:currentcolor}.option-group-title.sc-ic-menu{padding:1.5rem 0.438rem 0.5rem;color:var(--ic-color-tertiary-text)}.small.sc-ic-menu-h .option-group-title.sc-ic-menu{padding:0.75rem 0.438rem 0.25rem}.last-recommended-option.sc-ic-menu{border-bottom:var(--ic-border-default)}.disabled-option.sc-ic-menu{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option.sc-ic-menu,.focused-option.sc-ic-menu .option-description.sc-ic-menu{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}.no-results.sc-ic-menu-h li.sc-ic-menu{cursor:no-drop}.no-results.sc-ic-menu-h li.sc-ic-menu:hover{background-color:transparent}@media (forced-colors: active){.focused-option.sc-ic-menu:focus{outline:none;border:0.125rem solid transparent}}";
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 class Menu {
@@ -10951,7 +10978,7 @@ class Menu {
       this.optionHighlighted = "";
     };
     this.handleSubmitSearch = () => {
-      const highlightedOptionIndex = this.options.findIndex((option) => option.value === this.optionHighlighted);
+      const highlightedOptionIndex = this.options.findIndex((option) => option[this.valueField] === this.optionHighlighted);
       this.setInputValue(highlightedOptionIndex);
     };
     this.handleMenuChange = (open, focusInput) => {
@@ -10964,28 +10991,28 @@ class Menu {
     this.setNextOptionValue = (selectedOptionIndex) => {
       if (this.ungroupedOptions[selectedOptionIndex + 1]) {
         this.menuOptionSelect.emit({
-          value: this.ungroupedOptions[selectedOptionIndex + 1].value,
-          optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex + 1].value),
+          value: this.ungroupedOptions[selectedOptionIndex + 1][this.valueField],
+          optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex + 1][this.valueField]),
         });
       }
       else {
         this.menuOptionSelect.emit({
-          value: this.ungroupedOptions[0].value,
-          optionId: this.getOptionId(this.ungroupedOptions[0].value),
+          value: this.ungroupedOptions[0][this.valueField],
+          optionId: this.getOptionId(this.ungroupedOptions[0][this.valueField]),
         });
       }
     };
     this.setPreviousOptionValue = (selectedOptionIndex) => {
       if (this.ungroupedOptions[selectedOptionIndex - 1]) {
         this.menuOptionSelect.emit({
-          value: this.ungroupedOptions[selectedOptionIndex - 1].value,
-          optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex - 1].value),
+          value: this.ungroupedOptions[selectedOptionIndex - 1][this.valueField],
+          optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex - 1][this.valueField]),
         });
       }
       else {
         this.menuOptionSelect.emit({
-          value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,
-          optionId: this.getOptionId(this.ungroupedOptions[this.ungroupedOptions.length - 1].value),
+          value: this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField],
+          optionId: this.getOptionId(this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField]),
         });
       }
     };
@@ -11009,10 +11036,10 @@ class Menu {
       menuOptions[highlightedIndex] &&
         !menuOptions[highlightedIndex].timedOut &&
         (this.optionHighlighted =
-          menuOptions[highlightedIndex].value || undefined);
+          menuOptions[highlightedIndex][this.valueField] || undefined);
     };
     this.autoSetInputValueKeyboardOpen = (event) => {
-      const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option.value === this.value);
+      const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option[this.valueField] === this.value);
       this.keyboardNav = false;
       switch (event.key) {
         case "ArrowDown":
@@ -11034,10 +11061,9 @@ class Menu {
       }
     };
     this.manSetInputValueKeyboardOpen = (event) => {
-      var _a;
       const menuOptions = this.setMenuOptions();
       this.keyboardNav = false;
-      const highlightedOptionIndex = menuOptions.findIndex((option) => option.value === this.optionHighlighted);
+      const highlightedOptionIndex = menuOptions.findIndex((option) => option[this.valueField] === this.optionHighlighted);
       const getOptionId = (index) => { var _a; return (_a = Array.from(this.host.querySelectorAll("li"))[index]) === null || _a === void 0 ? void 0 : _a.id; };
       switch (event.key) {
         case "ArrowDown":
@@ -11098,7 +11124,9 @@ class Menu {
         case "Enter":
           event.preventDefault();
           this.setInputValue(highlightedOptionIndex);
-          this.value = (_a = menuOptions[highlightedOptionIndex]) === null || _a === void 0 ? void 0 : _a.value;
+          if (menuOptions[highlightedOptionIndex] !== undefined) {
+            this.value = menuOptions[highlightedOptionIndex][this.valueField];
+          }
           break;
         case "Escape":
           if (this.open) {
@@ -11141,11 +11169,10 @@ class Menu {
       }
     };
     this.setInputValue = (highlightedOptionIndex) => {
-      var _a;
       const menuOptions = this.setMenuOptions();
-      if (menuOptions[highlightedOptionIndex]) {
+      if (menuOptions[highlightedOptionIndex] !== undefined) {
         this.menuOptionSelect.emit({
-          value: (_a = menuOptions[highlightedOptionIndex]) === null || _a === void 0 ? void 0 : _a.value,
+          value: menuOptions[highlightedOptionIndex][this.valueField],
         });
         this.optionHighlighted = undefined;
         this.menuOptionId.emit({ optionId: undefined });
@@ -11198,7 +11225,7 @@ class Menu {
     };
     this.autoSetValueOnMenuKeyDown = (event) => {
       event.cancelBubble = true;
-      const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option.value === this.value);
+      const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option[this.valueField] === this.value);
       const isSearchableSelect = this.inputEl.tagName === "INPUT";
       this.keyboardNav = false;
       switch (event.key) {
@@ -11221,13 +11248,13 @@ class Menu {
           break;
         case "Home":
           this.menuOptionSelect.emit({
-            value: this.ungroupedOptions[0].value,
+            value: this.ungroupedOptions[0][this.valueField],
           });
           this.keyboardNav = true;
           break;
         case "End":
           this.menuOptionSelect.emit({
-            value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,
+            value: this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField],
           });
           this.keyboardNav = true;
           break;
@@ -11264,12 +11291,15 @@ class Menu {
       return `${this.menuId}-${value}`;
     };
     this.getOptionAriaLabel = (option, parentOption) => {
-      let ariaLabel = option.label;
+      let ariaLabel = option[this.labelField];
       if (option.description) {
         ariaLabel = `${ariaLabel}, ${option.description}`;
       }
+      if (option.element) {
+        ariaLabel = `${ariaLabel}, ${option.element.ariaLabel}`;
+      }
       if (parentOption) {
-        return `${ariaLabel}, ${parentOption.label} group`;
+        return `${ariaLabel}, ${parentOption[this.labelField]} group`;
       }
       else {
         return ariaLabel;
@@ -11322,19 +11352,19 @@ class Menu {
     };
     this.optionContent = (option) => {
       var _a;
-      return (hAsync(Fragment, null, option.loading && hAsync("ic-loading-indicator", { size: "icon" }), hAsync("div", { class: "option-text-container" }, hAsync("ic-typography", { variant: "body", "aria-hidden": "true" }, hAsync("p", null, option.label)), option.description && (hAsync("ic-typography", { id: `${this.getOptionId(option === null || option === void 0 ? void 0 : option.value)}-description`, class: "option-description", variant: "caption", "aria-hidden": "true" }, hAsync("p", null, option.description)))), !!option.value &&
+      return (hAsync(Fragment, null, option.loading && hAsync("ic-loading-indicator", { size: "icon" }), hAsync("div", { class: "option-text-container" }, hAsync("div", { class: "option-label" }, option.icon && (hAsync("div", { class: "option-icon", innerHTML: option.icon, "aria-hidden": "true" })), hAsync("ic-typography", { variant: "body", "aria-hidden": "true" }, hAsync("p", null, option[this.labelField]))), option.description && (hAsync("ic-typography", { id: `${this.getOptionId(option[this.valueField])}-description`, class: "option-description", variant: "caption", "aria-hidden": "true" }, hAsync("p", null, option.description))), option.element && (hAsync("div", { class: "option-element", innerHTML: option.element.component, "aria-hidden": "true" }))), !!option[this.valueField] &&
         !!this.value &&
-        (option === null || option === void 0 ? void 0 : option.value.toLowerCase()) === ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toLowerCase()) &&
+        option[this.valueField].toLowerCase() === ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toLowerCase()) &&
         this.parentEl.tagName !== "IC-SEARCH-BAR" && (hAsync("span", { class: "check-icon", innerHTML: checkIcon }))));
     };
     this.displayOption = (option, index, parentOption) => {
       const { open, value, keyboardNav, isManualMode, initialOptionsListRender, optionHighlighted, options, } = this;
-      return (hAsync("li", { id: this.getOptionId(option.value), class: {
+      return (hAsync("li", { id: this.getOptionId(option[this.valueField]), class: {
           option: true,
           "focused-option": isManualMode
             ? (keyboardNav || initialOptionsListRender) &&
-              option.value === optionHighlighted
-            : keyboardNav && option.value === value,
+              option[this.valueField] === optionHighlighted
+            : keyboardNav && option[this.valueField] === value,
           "last-recommended-option": option.recommended &&
             options[index + 1] &&
             !options[index + 1].recommended,
@@ -11342,10 +11372,11 @@ class Menu {
           "loading-option": option.loading,
           timeout: option.timedOut,
         }, role: "option", tabindex: open &&
-          (option.value === value || option.value === optionHighlighted) &&
+          (option[this.valueField] === value ||
+            option[this.valueField] === optionHighlighted) &&
           keyboardNav
           ? "0"
-          : "-1", "aria-label": this.getOptionAriaLabel(option, parentOption), "aria-selected": option.value === value, "aria-disabled": option.disabled ? "true" : "false", onClick: !option.timedOut && !option.loading && this.handleOptionClick, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, "data-value": option.value, "data-label": option.label }, option.timedOut ? (hAsync(Fragment, null, hAsync("div", { class: "loading-error-info" }, hAsync("svg", { class: "error-icon-svg", "aria-labelledby": "error-title", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "#000000" }, hAsync("title", { id: "error-title" }, "Error"), hAsync("path", { d: "M0 0h24v24H0z", fill: "none" }), hAsync("path", { d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z" })), hAsync("ic-typography", { variant: "label" }, option.label)), hAsync("ic-button", { size: "small", variant: "tertiary", onClick: this.handleRetry, onKeyDown: this.handleRetryKeyDown, onBlur: this.handleTimeoutBlur, id: "retry-button" }, "Retry"))) : (this.optionContent(option))));
+          : "-1", "aria-label": this.getOptionAriaLabel(option, parentOption), "aria-selected": option[this.valueField] === value, "aria-disabled": option.disabled ? "true" : "false", onClick: !option.timedOut && !option.loading && this.handleOptionClick, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, "data-value": option[this.valueField], "data-label": option[this.labelField] }, option.timedOut ? (hAsync(Fragment, null, hAsync("div", { class: "loading-error-info" }, hAsync("svg", { class: "error-icon-svg", "aria-labelledby": "error-title", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "#000000" }, hAsync("title", { id: "error-title" }, "Error"), hAsync("path", { d: "M0 0h24v24H0z", fill: "none" }), hAsync("path", { d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z" })), hAsync("ic-typography", { variant: "label" }, option[this.labelField])), hAsync("ic-button", { size: "small", variant: "tertiary", onClick: this.handleRetry, onKeyDown: this.handleRetryKeyDown, onBlur: this.handleTimeoutBlur, id: "retry-button" }, "Retry"))) : (this.optionContent(option))));
     };
     this.focusFromSearchKeypress = false;
     this.initialOptionsListRender = false;
@@ -11358,6 +11389,7 @@ class Menu {
     this.fullWidth = false;
     this.inputEl = undefined;
     this.inputLabel = undefined;
+    this.labelField = "label";
     this.menuId = undefined;
     this.open = undefined;
     this.parentEl = undefined;
@@ -11365,6 +11397,7 @@ class Menu {
     this.small = false;
     this.options = undefined;
     this.value = undefined;
+    this.valueField = "value";
   }
   watchOptionsHandler(newOptions) {
     this.hasTimedOut = newOptions.some((opt) => opt.timedOut);
@@ -11412,7 +11445,7 @@ class Menu {
     ], "Menu");
   }
   componentDidUpdate() {
-    const inputValueInOptions = this.options.some((option) => option.value === this.value);
+    const inputValueInOptions = this.options.some((option) => option[this.valueField] === this.value);
     const optionHighlightedIsSet = this.optionHighlighted !== null &&
       this.optionHighlighted !== undefined &&
       this.optionHighlighted !== "";
@@ -11531,7 +11564,7 @@ class Menu {
       } }, options.length !== 0 && (hAsync("ul", { id: menuId, class: "menu", role: "listbox", "aria-label": inputLabel, "aria-activedescendant": value != null && value !== "" ? this.getOptionId(value) : "", tabindex: open && !keyboardNav && (inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) !== "INPUT" ? "0" : "-1", ref: (el) => (this.menu = el), onKeyDown: this.handleMenuKeyDown, onKeyUp: this.handleMenuKeyUp, onBlur: this.handleBlur }, this.getSortedOptions(options).map((option, index) => {
       if (option.children) {
         if (option.children.length > 0) {
-          return (hAsync("div", null, hAsync("ic-typography", { class: "option-group-title", role: "presentation", variant: "subtitle-small" }, hAsync("p", null, option.label)), option.children.map((childOption) => this.displayOption(childOption, index, option))));
+          return (hAsync("div", null, hAsync("ic-typography", { class: "option-group-title", role: "presentation", variant: "subtitle-small" }, hAsync("p", null, option[this.labelField])), option.children.map((childOption) => this.displayOption(childOption, index, option))));
         }
         else {
           return null;
@@ -11558,6 +11591,7 @@ class Menu {
       "fullWidth": [4, "full-width"],
       "inputEl": [16],
       "inputLabel": [1, "input-label"],
+      "labelField": [1, "label-field"],
       "menuId": [1, "menu-id"],
       "open": [516],
       "parentEl": [16],
@@ -11565,6 +11599,7 @@ class Menu {
       "small": [516],
       "options": [16],
       "value": [1025],
+      "valueField": [1, "value-field"],
       "focusFromSearchKeypress": [32],
       "initialOptionsListRender": [32],
       "keyboardNav": [32],
@@ -13505,12 +13540,14 @@ class SearchBar {
     };
     this.onInput = (ev) => {
       this.value = ev.target.value;
-      const noOptions = [{ label: this.emptyOptionListText, value: "" }];
+      const noOptions = [
+        { [this.labelField]: this.emptyOptionListText, [this.valueField]: "" },
+      ];
       if (this.options.length > 0) {
         this.setMenuChange(true);
         this.preLoad = false;
         if (this.disableFilter === false) {
-          const rawFilteredOptions = getFilteredMenuOptions(this.options, false, this.value, "anywhere");
+          const rawFilteredOptions = getFilteredMenuOptions(this.options, false, this.value, "anywhere", this.labelField);
           this.filteredOptions =
             rawFilteredOptions.length > 0 ? rawFilteredOptions : noOptions;
         }
@@ -13569,14 +13606,22 @@ class SearchBar {
     };
     this.triggerLoading = () => {
       const loadingOption = [
-        { label: this.loadingLabel, value: "", loading: true },
+        {
+          [this.labelField]: this.loadingLabel,
+          [this.valueField]: "",
+          loading: true,
+        },
       ];
       if (this.filteredOptions !== loadingOption)
         this.filteredOptions = loadingOption;
       if (this.timeout) {
         this.timeoutTimer = window.setTimeout(() => {
           this.filteredOptions = [
-            { label: this.loadingErrorLabel, value: "", timedOut: true },
+            {
+              [this.labelField]: this.loadingErrorLabel,
+              [this.valueField]: "",
+              timedOut: true,
+            },
           ];
         }, this.timeout);
       }
@@ -13691,7 +13736,7 @@ class SearchBar {
     };
     this.hasOptionsOrFilterDisabled = () => this.options.length > 0 || this.disableFilter;
     this.hadNoOptions = () => this.filteredOptions.length === 1 &&
-      this.filteredOptions[0].label === this.emptyOptionListText &&
+      this.filteredOptions[0][this.labelField] === this.emptyOptionListText &&
       this.searchMode === "navigation";
     this.isSubmitDisabled = () => {
       const valueNotSet = this.value === undefined || this.value === null || this.value === "";
@@ -13708,9 +13753,9 @@ class SearchBar {
         this.menu.handleSetFirstOption();
         this.prevNoOption = false;
       }
-      const prevNoOptionsList = this.filteredOptions.find((filteredOption) => filteredOption.label === this.emptyOptionListText ||
-        filteredOption.label === this.loadingErrorLabel ||
-        filteredOption.label === this.loadingLabel);
+      const prevNoOptionsList = this.filteredOptions.find((filteredOption) => filteredOption[this.labelField] === this.emptyOptionListText ||
+        filteredOption[this.labelField] === this.loadingErrorLabel ||
+        filteredOption[this.labelField] === this.loadingLabel);
       if (prevNoOptionsList) {
         this.prevNoOption = true;
       }
@@ -13736,6 +13781,7 @@ class SearchBar {
     this.hideLabel = false;
     this.hintText = "When autocomplete results are available use the up and down arrows to choose and press enter to select";
     this.label = undefined;
+    this.labelField = "label";
     this.loading = false;
     this.loadingErrorLabel = "Loading Error";
     this.loadingLabel = "Loading...";
@@ -13747,6 +13793,7 @@ class SearchBar {
     this.small = false;
     this.spellcheck = false;
     this.timeout = undefined;
+    this.valueField = "value";
     this.filteredOptions = [];
     this.options = [];
     this.value = "";
@@ -13774,7 +13821,10 @@ class SearchBar {
         this.setMenuChange(true);
         !this.preLoad &&
           (this.filteredOptions = [
-            { label: this.emptyOptionListText, value: "" },
+            {
+              [this.labelField]: this.emptyOptionListText,
+              [this.valueField]: "",
+            },
           ]);
         this.preLoad = true;
       }
@@ -13784,8 +13834,8 @@ class SearchBar {
   watchValueHandler(newValue) {
     if (this.inputEl &&
       this.options &&
-      !!getLabelFromValue(newValue, this.options)) {
-      this.inputEl.value = getLabelFromValue(newValue, this.options);
+      !!getLabelFromValue(newValue, this.options, this.valueField, this.labelField)) {
+      this.inputEl.value = getLabelFromValue(newValue, this.options, this.valueField, this.labelField);
     }
     else if (this.inputEl && this.inputEl.value !== newValue) {
       this.inputEl.value = newValue;
@@ -13877,8 +13927,8 @@ class SearchBar {
     const menuOpen = hasSuggestedSearch && open && filteredOptions.length > 0;
     const menuRendered = menuOpen && value.length >= this.charactersUntilSuggestion;
     const isOrHasLoaded = this.filteredOptions.length === 1 &&
-      (this.filteredOptions[0].label === this.loadingLabel ||
-        filteredOptions[0].label === this.loadingErrorLabel);
+      (this.filteredOptions[0][this.labelField] === this.loadingLabel ||
+        filteredOptions[0][this.labelField] === this.loadingErrorLabel);
     let expanded;
     if (options.length > 0) {
       if (menuOpen) {
@@ -13897,8 +13947,9 @@ class SearchBar {
         ["fullwidth"]: fullWidth,
         ["disabled"]: disabled,
         ["small"]: small,
-      }, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, hAsync("ic-text-field", { ref: (el) => (this.inputEl = el), inputId: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly, small: small, hideLabel: hideLabel, fullWidth: fullWidth, name: name, truncateValue: truncateValue, value: options && !!getLabelFromValue(value, options)
-        ? getLabelFromValue(value, options)
+      }, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, hAsync("ic-text-field", { ref: (el) => (this.inputEl = el), inputId: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly, small: small, hideLabel: hideLabel, fullWidth: fullWidth, name: name, truncateValue: truncateValue, value: options &&
+        !!getLabelFromValue(value, options, this.valueField, this.labelField)
+        ? getLabelFromValue(value, options, this.valueField, this.labelField)
         : value, placeholder: placeholder, onInput: this.onInput, onBlur: this.onInputBlur, onFocus: this.onInputFocus, "aria-label": hideLabel ? label : "", "aria-describedby": describedById, "aria-owns": menuRendered ? menuId : undefined, "aria-haspopup": options.length > 0 ? "listbox" : undefined, ariaExpanded: expanded, ariaActiveDescendant: ariaActiveDescendant, "aria-autocomplete": hasSuggestedSearch ? "list" : undefined, role: hasSuggestedSearch ? "combobox" : undefined, autocomplete: autocomplete, autocapitalize: autocapitalize, autoFocus: autofocus, spellcheck: spellcheck, inputmode: "search", debounce: this.debounce }, hAsync("div", { class: {
         "clear-button-container": true,
         "clear-button-visible": value && !disabledMode && this.showClearButton,
@@ -13917,7 +13968,7 @@ class SearchBar {
         fullwidth: fullWidth,
       }, slot: "menu" }, menuRendered && (hAsync("ic-menu", { class: {
         "no-results": this.hadNoOptions() || isOrHasLoaded,
-      }, activationType: "manual", anchorEl: this.anchorEl, autoFocusOnSelected: false, searchMode: this.searchMode, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), small: small, fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onMenuOptionSelect: this.handleOptionSelect, onMenuStateChange: this.handleMenuChange, onMenuOptionId: this.handleMenuOptionHighlight, onRetryButtonClicked: this.handleRetry, parentEl: this.el, value: value })))), hAsync("div", { "aria-live": "polite", role: "status", class: "search-results-status" })));
+      }, activationType: "manual", anchorEl: this.anchorEl, autoFocusOnSelected: false, searchMode: this.searchMode, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), small: small, fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onMenuOptionSelect: this.handleOptionSelect, onMenuStateChange: this.handleMenuChange, onMenuOptionId: this.handleMenuOptionHighlight, onRetryButtonClicked: this.handleRetry, parentEl: this.el, value: value, labelField: this.labelField, valueField: this.valueField })))), hAsync("div", { "aria-live": "polite", role: "status", class: "search-results-status" })));
   }
   static get delegatesFocus() { return true; }
   get el() { return getElement(this); }
@@ -13947,6 +13998,7 @@ class SearchBar {
       "hideLabel": [4, "hide-label"],
       "hintText": [1, "hint-text"],
       "label": [1],
+      "labelField": [1, "label-field"],
       "loading": [1028],
       "loadingErrorLabel": [1, "loading-error-label"],
       "loadingLabel": [1, "loading-label"],
@@ -13958,6 +14010,7 @@ class SearchBar {
       "small": [4],
       "spellcheck": [4],
       "timeout": [2],
+      "valueField": [1, "value-field"],
       "options": [16],
       "value": [1537],
       "ariaActiveDescendant": [32],
@@ -14060,6 +14113,48 @@ class Select {
       clearTimeout(this.debounceIcChange);
       this.icChange.emit({ value: value });
     };
+    /**
+     * Processes the provided array of IcMenuOptions, removing duplicates and reporting them with a console.warn
+     * @param options array of IcMenuOptions
+     * @returns a new options object, with all entries possessing a duplicate 'value' field removed
+     */
+    this.deduplicateOptions = (options) => {
+      const uniqueValues = [];
+      const dedupedOptions = [];
+      let dedupedChildren;
+      options.forEach((option) => {
+        if (option.children) {
+          //If an option has children, we will loop through them
+          dedupedChildren = [];
+          option.children.forEach((child) => {
+            if (uniqueValues.includes(child.value)) {
+              console.warn(`ic-select with label ${this.label} was populated with duplicate option (value: ${child.value}) which has been removed.`);
+            }
+            else {
+              uniqueValues.push(child.value);
+              dedupedChildren.push(child);
+            }
+          });
+          // construct a modified option, inserting the deduplicated children alongside the original information
+          const modifiedParent = Object.assign(Object.assign({}, option), { children: dedupedChildren });
+          dedupedOptions.push(modifiedParent);
+        }
+        else {
+          // If an option does not have children, assess to see if it's value has been included already
+          if (uniqueValues.includes(option.value)) {
+            console.warn(`ic-select with label ${this.label} was populated with duplicate option (value: ${option.value}) which has been removed.`);
+          }
+          else {
+            uniqueValues.push(option.value);
+            dedupedOptions.push(option);
+          }
+        }
+      });
+      return dedupedOptions;
+    };
+    /**
+     * Loop through options array and for all options with no value, infer it from the label
+     */
     this.setOptionsValuesFromLabels = () => {
       if (this.options.length > 0 && this.options.map) {
         this.options.map((option) => {
@@ -14086,7 +14181,7 @@ class Select {
       }
     };
     this.getLabelFromValue = (value) => {
-      return getLabelFromValue(value, this.options);
+      return getLabelFromValue(value, this.uniqueOptions);
     };
     this.getFilteredChildMenuOptions = (option) => {
       let children = option.children;
@@ -14162,7 +14257,7 @@ class Select {
           !this.loading &&
           (!this.searchable || this.searchableMenuItemSelected)) {
           this.noOptions = null;
-          this.menu.options = this.options;
+          this.menu.options = this.uniqueOptions;
         }
       }
       if (event.detail !== 0) {
@@ -14186,7 +14281,7 @@ class Select {
       if (this.searchable) {
         this.searchableSelectElement.value = null;
         this.searchableSelectInputValue = null;
-        this.filteredOptions = this.options;
+        this.filteredOptions = this.uniqueOptions;
         this.hiddenInputValue = null;
         this.searchableSelectElement.focus();
       }
@@ -14234,7 +14329,7 @@ class Select {
         else {
           if (!this.hasTimedOut) {
             this.noOptions = null;
-            this.menu.options = this.options;
+            this.menu.options = this.uniqueOptions;
           }
         }
       }
@@ -14266,7 +14361,7 @@ class Select {
       this.clearButtonFocused = false;
     };
     this.handleFilter = () => {
-      const options = this.searchable ? [...this.options] : this.ungroupedOptions;
+      const options = this.deduplicateOptions(this.searchable ? [...this.uniqueOptions] : this.ungroupedOptions);
       let isGrouped = false;
       let newFilteredOptions = [];
       options.map((option) => {
@@ -14318,13 +14413,19 @@ class Select {
         this.filteredOptions = this.noOptions;
       }
     };
+    /**
+     * Put the select component into loading state.
+     * Replace options with the loading message. If timeout is enabled, set the timeout and once passed, replace options with the loading error message
+     */
     this.triggerLoading = () => {
       this.hasTimedOut = false;
       this.noOptions = [{ label: this.loadingLabel, value: "", loading: true }];
-      if (this.filteredOptions !== this.noOptions && this.searchable)
+      if (this.filteredOptions !== this.noOptions && this.searchable) {
         this.filteredOptions = this.noOptions;
-      else if (!this.searchable && this.options !== this.noOptions)
-        this.options = this.noOptions;
+      }
+      else if (this.uniqueOptions !== this.noOptions && !this.searchable) {
+        this.uniqueOptions = this.noOptions;
+      }
       if (this.timeout) {
         this.timeoutTimer = window.setTimeout(() => {
           this.loading = false;
@@ -14334,13 +14435,13 @@ class Select {
           ];
           this.filteredOptions = this.noOptions;
           if (!this.searchable)
-            this.options = this.noOptions;
+            this.uniqueOptions = this.noOptions;
         }, this.timeout);
       }
     };
     this.getValueFromLabel = (label) => {
       var _a;
-      return (_a = this.options.find((option) => option.label === label)) === null || _a === void 0 ? void 0 : _a.value;
+      return (_a = this.uniqueOptions.find((option) => option.label === label)) === null || _a === void 0 ? void 0 : _a.value;
     };
     this.handleSearchableSelectInput = (event) => {
       this.searchableSelectInputValue = event.target.value;
@@ -14443,6 +14544,7 @@ class Select {
     this.loading = false;
     this.options = [];
     this.filteredOptions = this.options;
+    this.uniqueOptions = this.options;
     this.debounce = 0;
     this.currDebounce = this.debounce;
     this.value = undefined;
@@ -14461,10 +14563,12 @@ class Select {
         if (this.options.length > 0) {
           this.setOptionsValuesFromLabels();
           this.noOptions = null;
-          this.filteredOptions = this.options;
+          this.uniqueOptions = this.deduplicateOptions(this.options);
+          this.filteredOptions = this.uniqueOptions;
         }
         else {
           this.noOptions = [{ label: this.emptyOptionListText, value: "" }];
+          this.uniqueOptions = this.noOptions;
           this.filteredOptions = this.noOptions;
         }
         this.updateSearchableSelectResultAriaLive();
@@ -14472,7 +14576,8 @@ class Select {
       }
       else {
         this.setOptionsValuesFromLabels();
-        this.filteredOptions = this.options;
+        this.uniqueOptions = this.deduplicateOptions(this.options);
+        this.filteredOptions = this.uniqueOptions;
         if (this.initialOptionsEmpty) {
           this.setDefaultValue();
           this.initialOptionsEmpty = false;
@@ -14513,12 +14618,14 @@ class Select {
     }
     else {
       this.setDefaultValue();
+      this.uniqueOptions = this.deduplicateOptions(this.options);
     }
   }
   componentDidLoad() {
     onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Select");
-    if (this.loading)
+    if (this.loading) {
       this.triggerLoading();
+    }
     this.hiddenInputValue = this.searchable && this.currValue;
   }
   componentDidRender() {
@@ -14604,7 +14711,7 @@ class Select {
         "no-results": noOptionSelect,
       }, ref: (el) => (this.menu = el), inputEl: searchable
         ? this.searchableSelectElement
-        : this.customSelectElement, inputLabel: label, anchorEl: this.anchorEl, small: small, menuId: menuId, open: this.open, options: searchable ? this.filteredOptions : options, value: currValue, fullWidth: fullWidth, onMenuStateChange: this.handleMenuChange, onMenuOptionSelect: this.handleCustomSelectChange, onMenuKeyPress: this.handleMenuKeyPress, onMenuValueChange: this.handleMenuValueChange, onUngroupedOptionsSet: this.setUngroupedOptions, onRetryButtonClicked: this.handleRetry, parentEl: this.host, onTimeoutBlur: this.onTimeoutBlur, activationType: this.searchable ? "manual" : "automatic" })), hasValidationStatus(this.validationStatus, this.disabled) && (hAsync("ic-input-validation", { class: { "menu-open": this.open }, ariaLiveMode: "polite", status: validationStatus, message: validationText, for: this.inputId })))));
+        : this.customSelectElement, inputLabel: label, anchorEl: this.anchorEl, small: small, menuId: menuId, open: this.open, options: searchable ? this.filteredOptions : this.uniqueOptions, value: currValue, fullWidth: fullWidth, onMenuStateChange: this.handleMenuChange, onMenuOptionSelect: this.handleCustomSelectChange, onMenuKeyPress: this.handleMenuKeyPress, onMenuValueChange: this.handleMenuValueChange, onUngroupedOptionsSet: this.setUngroupedOptions, onRetryButtonClicked: this.handleRetry, parentEl: this.host, onTimeoutBlur: this.onTimeoutBlur, activationType: this.searchable ? "manual" : "automatic" })), hasValidationStatus(this.validationStatus, this.disabled) && (hAsync("ic-input-validation", { class: { "menu-open": this.open }, ariaLiveMode: "polite", status: validationStatus, message: validationText, for: this.inputId })))));
   }
   static get delegatesFocus() { return true; }
   get host() { return getElement(this); }
@@ -14655,6 +14762,7 @@ class Select {
       "pressedCharacters": [32],
       "searchableSelectInputValue": [32],
       "filteredOptions": [32],
+      "uniqueOptions": [32],
       "currDebounce": [32],
       "initialValue": [32],
       "inputValueToFilter": [32],
@@ -17569,8 +17677,8 @@ function renderBuildDiagnostic(e, t, r, s) {
   type: "build",
   header: r,
   messageText: s,
-  relFilePath: null,
-  absFilePath: null,
+  relFilePath: void 0,
+  absFilePath: void 0,
   lines: []
  };
  return e.pathname ? "/" !== e.pathname && (n.header += ": " + e.pathname) : e.url && (n.header += ": " + e.url), 
@@ -17788,7 +17896,7 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
    line: r,
    column: s
   };
-  return t => (t.position = new z(e), m(), t);
+  return t => (t.position = new A(e), m(), t);
  }, a = o => {
   const i = e.split("\n"), a = {
    level: "error",
@@ -17833,7 +17941,7 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
  }, d = () => {
   let t;
   const r = [];
-  for (m(), h(r); e.length && "}" !== e.charAt(0) && (t = w() || A()); ) r.push(t), 
+  for (m(), h(r); e.length && "}" !== e.charAt(0) && (t = T() || w()); ) r.push(t), 
   h(r);
   return r;
  }, m = () => u(/^\s*/), h = e => {
@@ -17894,7 +18002,7 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
    };
    return o[e] = n[1].trim(), s(o);
   };
- }, E = S("import", 7), b = S("charset", 0), T = S("namespace", 11), w = () => "@" !== e[0] ? null : (() => {
+ }, E = S("import", 7), b = S("charset", 0), v = S("namespace", 11), T = () => "@" !== e[0] ? null : (() => {
   const e = i();
   let t = u(/^@([-\w]+)?keyframes\s*/);
   if (!t) return null;
@@ -17939,7 +18047,7 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
    supports: r,
    rules: s
   }) : a("@supports missing '}'");
- })() || E() || b() || T() || (() => {
+ })() || E() || b() || v() || (() => {
   const e = i(), t = u(/^@([-\w]+)?document *([^{]+)/);
   if (!t) return null;
   const r = trim(t[1]), s = trim(t[2]);
@@ -17982,7 +18090,7 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
    type: 5,
    declarations: r
   }) : a("@font-face missing '}'");
- })(), A = () => {
+ })(), w = () => {
   const e = i(), t = f();
   return t ? (h(), e({
    type: 13,
@@ -17990,7 +18098,7 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
    declarations: y()
   })) : a("selector missing");
  };
- class z {
+ class A {
   constructor(e) {
    this.start = e, this.end = {
     line: r,
@@ -17998,7 +18106,7 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
    }, this.source = t;
   }
  }
- return z.prototype.content = e, {
+ return A.prototype.content = e, {
   diagnostics: n,
   ...addParent((() => {
    const e = d();
@@ -18039,54 +18147,62 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
  ids: [],
  attrs: []
 }, serializeCssVisitNode = (e, t, r, s) => {
- const n = t.type;
- return 4 === n ? serializeCssDeclaration(t, r, s) : 13 === n ? serializeCssRule(e, t) : 1 === n ? "!" === t.comment[0] ? `/*${t.comment}*/` : "" : 10 === n ? serializeCssMedia(e, t) : 8 === n ? serializeCssKeyframes(e, t) : 9 === n ? serializeCssKeyframe(e, t) : 5 === n ? serializeCssFontFace(e, t) : 15 === n ? serializeCssSupports(e, t) : 7 === n ? "@import " + t.import + ";" : 0 === n ? "@charset " + t.charset + ";" : 12 === n ? serializeCssPage(e, t) : 6 === n ? "@host{" + serializeCssMapVisit(e, t.rules) + "}" : 2 === n ? "@custom-media " + t.name + " " + t.media + ";" : 3 === n ? serializeCssDocument(e, t) : 11 === n ? "@namespace " + t.namespace + ";" : "";
+ var n;
+ const o = t.type;
+ return 4 === o ? serializeCssDeclaration(t, r, s) : 13 === o ? serializeCssRule(e, t) : 1 === o ? "!" === (null === (n = t.comment) || void 0 === n ? void 0 : n[0]) ? `/*${t.comment}*/` : "" : 10 === o ? serializeCssMedia(e, t) : 8 === o ? serializeCssKeyframes(e, t) : 9 === o ? serializeCssKeyframe(e, t) : 5 === o ? serializeCssFontFace(e, t) : 15 === o ? serializeCssSupports(e, t) : 7 === o ? "@import " + t.import + ";" : 0 === o ? "@charset " + t.charset + ";" : 12 === o ? serializeCssPage(e, t) : 6 === o ? "@host{" + serializeCssMapVisit(e, t.rules) + "}" : 2 === o ? "@custom-media " + t.name + " " + t.media + ";" : 3 === o ? serializeCssDocument(e, t) : 11 === o ? "@namespace " + t.namespace + ";" : "";
 }, serializeCssRule = (e, t) => {
- const r = t.declarations, s = e.usedSelectors, n = t.selectors.slice();
- if (null == r || 0 === r.length) return "";
- if (s) {
-  let t, r, o = !0;
-  for (t = n.length - 1; t >= 0; t--) {
-   const i = getCssSelectors(n[t]);
-   o = !0;
-   let a = i.classNames.length;
-   if (a > 0 && e.hasUsedClassNames) for (r = 0; r < a; r++) if (!s.classNames.has(i.classNames[r])) {
-    o = !1;
+ var r, s;
+ const n = t.declarations, o = e.usedSelectors, i = null !== (s = null === (r = t.selectors) || void 0 === r ? void 0 : r.slice()) && void 0 !== s ? s : [];
+ if (null == n || 0 === n.length) return "";
+ if (o) {
+  let t, r, s = !0;
+  for (t = i.length - 1; t >= 0; t--) {
+   const n = getCssSelectors(i[t]);
+   s = !0;
+   let a = n.classNames.length;
+   if (a > 0 && e.hasUsedClassNames) for (r = 0; r < a; r++) if (!o.classNames.has(n.classNames[r])) {
+    s = !1;
     break;
    }
-   if (o && e.hasUsedTags && (a = i.tags.length, a > 0)) for (r = 0; r < a; r++) if (!s.tags.has(i.tags[r])) {
-    o = !1;
+   if (s && e.hasUsedTags && (a = n.tags.length, a > 0)) for (r = 0; r < a; r++) if (!o.tags.has(n.tags[r])) {
+    s = !1;
     break;
    }
-   if (o && e.hasUsedAttrs && (a = i.attrs.length, a > 0)) for (r = 0; r < a; r++) if (!s.attrs.has(i.attrs[r])) {
-    o = !1;
+   if (s && e.hasUsedAttrs && (a = n.attrs.length, a > 0)) for (r = 0; r < a; r++) if (!o.attrs.has(n.attrs[r])) {
+    s = !1;
     break;
    }
-   if (o && e.hasUsedIds && (a = i.ids.length, a > 0)) for (r = 0; r < a; r++) if (!s.ids.has(i.ids[r])) {
-    o = !1;
+   if (s && e.hasUsedIds && (a = n.ids.length, a > 0)) for (r = 0; r < a; r++) if (!o.ids.has(n.ids[r])) {
+    s = !1;
     break;
    }
-   o || n.splice(t, 1);
+   s || i.splice(t, 1);
   }
  }
- if (0 === n.length) return "";
- const o = [];
- let i = "";
- for (const e of t.selectors) i = removeSelectorWhitespace(e), o.includes(i) || o.push(i);
- return `${o}{${serializeCssMapVisit(e, r)}}`;
+ if (0 === i.length) return "";
+ const a = [];
+ let l = "";
+ if (t.selectors) for (const e of t.selectors) l = removeSelectorWhitespace(e), a.includes(l) || a.push(l);
+ return `${a}{${serializeCssMapVisit(e, n)}}`;
 }, serializeCssDeclaration = (e, t, r) => "" === e.value ? "" : r - 1 === t ? e.property + ":" + e.value : e.property + ":" + e.value + ";", serializeCssMedia = (e, t) => {
  const r = serializeCssMapVisit(e, t.rules);
  return "" === r ? "" : "@media " + removeMediaWhitespace(t.media) + "{" + r + "}";
 }, serializeCssKeyframes = (e, t) => {
  const r = serializeCssMapVisit(e, t.keyframes);
  return "" === r ? "" : "@" + (t.vendor || "") + "keyframes " + t.name + "{" + r + "}";
-}, serializeCssKeyframe = (e, t) => t.values.join(",") + "{" + serializeCssMapVisit(e, t.declarations) + "}", serializeCssFontFace = (e, t) => {
+}, serializeCssKeyframe = (e, t) => {
+ var r, s;
+ return (null !== (s = null === (r = t.values) || void 0 === r ? void 0 : r.join(",")) && void 0 !== s ? s : "") + "{" + serializeCssMapVisit(e, t.declarations) + "}";
+}, serializeCssFontFace = (e, t) => {
  const r = serializeCssMapVisit(e, t.declarations);
  return "" === r ? "" : "@font-face{" + r + "}";
 }, serializeCssSupports = (e, t) => {
  const r = serializeCssMapVisit(e, t.rules);
  return "" === r ? "" : "@supports " + t.supports + "{" + r + "}";
-}, serializeCssPage = (e, t) => "@page " + t.selectors.join(", ") + "{" + serializeCssMapVisit(e, t.declarations) + "}", serializeCssDocument = (e, t) => {
+}, serializeCssPage = (e, t) => {
+ var r, s;
+ return "@page " + (null !== (s = null === (r = t.selectors) || void 0 === r ? void 0 : r.join(", ")) && void 0 !== s ? s : "") + "{" + serializeCssMapVisit(e, t.declarations) + "}";
+}, serializeCssDocument = (e, t) => {
  const r = serializeCssMapVisit(e, t.rules), s = "@" + (t.vendor || "") + "document " + t.document;
  return "" === r ? "" : s + "{" + r + "}";
 }, serializeCssMapVisit = (e, t) => {
@@ -18103,12 +18219,14 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
  } else t += r;
  return t;
 }, removeMediaWhitespace = e => {
- let t = "", r = "";
- for (let s = 0, n = (e = e.trim()).length; s < n; s++) if (r = e[s], CSS_WS_REG.test(r)) {
-  if (CSS_WS_REG.test(t[t.length - 1])) continue;
-  t += " ";
- } else t += r;
- return t;
+ var t;
+ let r = "", s = "";
+ for (let n = 0, o = (e = null !== (t = null == e ? void 0 : e.trim()) && void 0 !== t ? t : "").length; n < o; n++) if (s = e[n], 
+ CSS_WS_REG.test(s)) {
+  if (CSS_WS_REG.test(r[r.length - 1])) continue;
+  r += " ";
+ } else r += s;
+ return r;
 }, CSS_WS_REG = /\s/, CSS_NEXT_CHAR_REG = /[>\(\)\~\,\+\s]/, CSS_PREV_CHAR_REG = /[>\(\~\,\+]/, collectUsedSelectors = (e, t) => {
  if (null != t && 1 === t.nodeType) {
   const r = t.children, s = t.nodeName.toLowerCase();
@@ -18145,8 +18263,6 @@ const templateWindows = new Map, isPromise = e => !!e && ("object" == typeof e |
     type: "build",
     header: "Build Error",
     messageText: "build error",
-    relFilePath: null,
-    absFilePath: null,
     lines: []
    };
    null != t && (null != t.stack ? s.messageText = t.stack.toString() : null != t.message ? s.messageText = t.message.length ? t.message : "UNKNOWN ERROR" : s.messageText = t.toString()),