@ukic/web-components 2.1.0-beta.10 → 2.1.0-beta.11

package/dist/components/ic-menu-item2.js

@@ -0,0 +1,167 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { a as onComponentRequiredPropUndefined, i as isSlotUsed, O as getParentElement } from './helpers.js';
+import { c as checkIcon } from './check-icon.js';
+import { c as chevronIcon } from './chevron-icon.js';
+import { d as defineCustomElement$4 } from './ic-button2.js';
+import { d as defineCustomElement$3 } from './ic-loading-indicator2.js';
+import { d as defineCustomElement$2 } from './ic-tooltip2.js';
+import { d as defineCustomElement$1 } from './ic-typography2.js';
+
+const icMenuItemCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}li{list-style:none;padding:0}:host::part(button){color:var(--ic-color-primary-text);padding:calc(var(--ic-space-xxxs) / 2);display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:0;min-height:2.5rem;height:auto}.focus-border{display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:var(--ic-border-radius);margin:calc(var(--ic-space-xxxs) / 2);padding:var(--ic-space-xxs);border:var(--ic-space-xxxs) dashed transparent;--icon-height:auto}:host(.disabled)::part(button){color:var(--ic-architectural-200) !important;pointer-events:none}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant=\"destructive\"])::part(button){color:var(--ic-action-destructive)}:host::part(button):hover{background-color:var(--ic-action-dark-bg-hover)}:host::part(button):focus-visible,:host::part(button):focus{color:var(--ic-color-white-text);background-color:var(--ic-focus-blue);box-shadow:none}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{color:var(--ic-theme-lighten-40) !important}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant=\"destructive\"])::part(button):focus-visible,:host([variant=\"destructive\"])::part(button):focus{background-color:var(--ic-action-destructive)}ic-button:focus-within .menu-item-label,ic-button:focus-within .shortcut,ic-button:focus-within .menu-item-description{color:var(--ic-color-white-text)}:host(.disabled) ic-button:focus-within .focus-border{border-color:var(--ic-architectural-white)}:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:var(--ic-theme-lighten-40) !important}:host::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-color-primary-text) !important}:host([variant=\"destructive\"])::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-destructive) !important}.menu-item-info{display:flex;flex-direction:column;flex:1;align-items:baseline;white-space:pre-line;text-align:left}.menu-labels{display:flex;align-items:baseline;gap:var(--ic-space-xs)}.menu-item-description{color:var(--ic-color-secondary-text)}.shortcut{color:var(--ic-color-tertiary-text);display:flex;flex:min-content}:host([variant=\"destructive\"]) .menu-item-label{text-transform:uppercase;font-weight:600;letter-spacing:0.025em}ic-button:active .menu-item-label{color:var(--ic-color-primary-text)}ic-button:active .menu-item-description{color:var(--ic-color-secondary-text)}ic-button:active .shortcut{color:var(--ic-color-tertiary-text)}:host([variant=\"destructive\"]) ic-button:active .menu-item-label{color:var(--ic-action-destructive) !important}.icon,.check-icon,.submenu-icon,.icon ::slotted(svg),.check-icon svg,.submenu-icon svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.check-icon.hide{visibility:hidden}@media (forced-colors: active){:host::part(button){border:Canvas}:host::part(button):focus-visible{outline:var(--ic-space-xxxs) solid transparent}.focus-border{border-color:Canvas}:host(.disabled) ic-button:focus-within .focus-border{border-color:GrayText}:host(.disabled) .menu-item-info,:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description,:host(.disabled) ic-button:focus-within .menu-item-info,:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:GrayText !important}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{outline-color:GrayText !important}}";
+
+const MenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.childBlur = createEvent(this, "childBlur", 7);
+    this.triggerPopoverMenuInstance = createEvent(this, "triggerPopoverMenuInstance", 7);
+    this.handleMenuItemClick = createEvent(this, "handleMenuItemClick", 7);
+    this.handleClick = (e) => {
+      e.preventDefault();
+      if (this.submenuTriggerFor !== undefined) {
+        this.triggerPopoverMenuInstance.emit();
+      }
+      else if (this.variant === "toggle") {
+        this.toggleChecked
+          ? (this.toggleChecked = false)
+          : (this.toggleChecked = true);
+      }
+      this.handleMenuItemClick.emit({
+        label: this.label,
+        hasSubMenu: !!this.el.submenuTriggerFor,
+      });
+    };
+    this.getMenuItemAriaLabel = () => {
+      let ariaLabel = this.label;
+      if (this.description !== undefined) {
+        ariaLabel = `${ariaLabel}, ${this.description}`;
+      }
+      if (this.keyboardShortcut !== undefined) {
+        ariaLabel = `${ariaLabel}, ${this.keyboardShortcut}`;
+      }
+      if (this.variant === "destructive") {
+        ariaLabel = `${ariaLabel}, destructive`;
+      }
+      if (this.submenuTriggerFor !== undefined) {
+        ariaLabel = `${ariaLabel}, triggers submenu`;
+      }
+      if (this.el.classList.contains("ic-popover-submenu-back-button")) {
+        ariaLabel = "Go back to parent menu";
+      }
+      const parentEl = getParentElement(this.el);
+      if (parentEl.tagName === "IC-MENU-GROUP") {
+        return `${ariaLabel}, ${parentEl.label} menu group`;
+      }
+      else {
+        return ariaLabel;
+      }
+    };
+    this.variant = "default";
+    this.label = undefined;
+    this.description = undefined;
+    this.disabled = false;
+    this.href = undefined;
+    this.target = undefined;
+    this.rel = undefined;
+    this.hreflang = undefined;
+    this.referrerpolicy = undefined;
+    this.keyboardShortcut = undefined;
+    this.submenuTriggerFor = undefined;
+    this.toggleChecked = false;
+  }
+  handleHostClick(e) {
+    if (this.disabled) {
+      e.stopImmediatePropagation();
+    }
+  }
+  componentWillLoad() {
+    // This ensures that trigger menu items are always set to the default variant
+    if (this.submenuTriggerFor !== undefined && this.variant !== "default") {
+      this.variant = "default";
+    }
+  }
+  componentDidLoad() {
+    onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Menu Item");
+  }
+  render() {
+    // A helper function that checks if a prop has been defined
+    const isPropDefined = (prop) => {
+      return prop !== undefined ? prop : null;
+    };
+    // A sub-component to layout the menu information correctly in ic-button
+    const MenuItemInformation = () => {
+      return (h("div", { class: "menu-item-info" }, h("div", { class: "menu-labels" }, h("ic-typography", { class: "menu-item-label" }, this.label), this.keyboardShortcut && (h("ic-typography", { variant: "caption", class: "shortcut" }, this.keyboardShortcut))), this.description && (h("ic-typography", { class: "menu-item-description", variant: "caption" }, this.description))));
+    };
+    return (h(Host, { class: {
+        ["disabled"]: this.disabled,
+      } }, h("li", { role: this.variant === "toggle" ? "menuitemcheckbox" : "menuitem", "aria-disabled": `${this.disabled}`, "aria-checked": this.variant === "toggle" && this.toggleChecked === true
+        ? true
+        : this.variant === "toggle" && this.toggleChecked === false
+          ? false
+          : undefined }, h("ic-button", { disableTooltip: true, fullWidth: true, variant: "tertiary", onClick: this.handleClick, href: isPropDefined(this.href), hreflang: isPropDefined(this.hreflang), target: isPropDefined(this.target), rel: isPropDefined(this.rel), referrerpolicy: this.referrerpolicy !== undefined ? this.referrerpolicy : null, "aria-disabled": `${this.disabled}`, "aria-label": this.getMenuItemAriaLabel(), "aria-controls": this.submenuTriggerFor !== undefined
+        ? `ic-popover-submenu-${this.submenuTriggerFor}`
+        : false, "aria-haspopup": this.submenuTriggerFor !== undefined ||
+        this.el.classList.contains("ic-popover-submenu-back-button")
+        ? "menu"
+        : false, "aria-owns": this.submenuTriggerFor !== undefined
+        ? `ic-popover-submenu-${this.submenuTriggerFor}`
+        : false }, h("div", { class: "focus-border" }, isSlotUsed(this.el, "icon") && (h("span", { class: "icon" }, h("slot", { name: "icon" }))), h(MenuItemInformation, null), this.variant === "toggle" && (h("span", { class: {
+        ["check-icon"]: true,
+        ["hide"]: !this.toggleChecked,
+      }, "aria-hidden": "true", innerHTML: checkIcon })), this.submenuTriggerFor !== undefined && (h("span", { class: { ["submenu-icon"]: true }, "aria-hidden": "true", innerHTML: chevronIcon })))))));
+  }
+  static get delegatesFocus() { return true; }
+  get el() { return this; }
+  static get style() { return icMenuItemCss; }
+}, [17, "ic-menu-item", {
+    "variant": [1537],
+    "label": [1],
+    "description": [1],
+    "disabled": [4],
+    "href": [1],
+    "target": [1],
+    "rel": [1],
+    "hreflang": [1],
+    "referrerpolicy": [1],
+    "keyboardShortcut": [1, "keyboard-shortcut"],
+    "submenuTriggerFor": [1, "submenu-trigger-for"],
+    "toggleChecked": [32]
+  }, [[2, "click", "handleHostClick"]]]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["ic-menu-item", "ic-button", "ic-loading-indicator", "ic-tooltip", "ic-typography"];
+  components.forEach(tagName => { switch (tagName) {
+    case "ic-menu-item":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, MenuItem);
+      }
+      break;
+    case "ic-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "ic-loading-indicator":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "ic-tooltip":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+    case "ic-typography":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+
+export { MenuItem as M, defineCustomElement as d };
+
+//# sourceMappingURL=ic-menu-item2.js.map

package/dist/components/ic-menu-item2.js.map

@@ -0,0 +1 @@
+{"file":"ic-menu-item2.js","mappings":";;;;;;;;;AAAA,MAAM,aAAa,GAAG,iqMAAiqM;;MC+B1qM,QAAQ;;;;;;;;IAyEX,gBAAW,GAAG,CAAC,CAAQ;MAC7B,CAAC,CAAC,cAAc,EAAE,CAAC;MACnB,IAAI,IAAI,CAAC,iBAAiB,KAAK,SAAS,EAAE;QACxC,IAAI,CAAC,0BAA0B,CAAC,IAAI,EAAE,CAAC;OACxC;WAAM,IAAI,IAAI,CAAC,OAAO,KAAK,QAAQ,EAAE;QACpC,IAAI,CAAC,aAAa;aACb,IAAI,CAAC,aAAa,GAAG,KAAK;aAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC;OACjC;MACD,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC;QAC5B,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,UAAU,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,iBAAiB;OACxC,CAAC,CAAC;KACJ,CAAC;IAgBM,yBAAoB,GAAG;MAC7B,IAAI,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;MAE3B,IAAI,IAAI,CAAC,WAAW,KAAK,SAAS,EAAE;QAClC,SAAS,GAAG,GAAG,SAAS,KAAK,IAAI,CAAC,WAAW,EAAE,CAAC;OACjD;MAED,IAAI,IAAI,CAAC,gBAAgB,KAAK,SAAS,EAAE;QACvC,SAAS,GAAG,GAAG,SAAS,KAAK,IAAI,CAAC,gBAAgB,EAAE,CAAC;OACtD;MAED,IAAI,IAAI,CAAC,OAAO,KAAK,aAAa,EAAE;QAClC,SAAS,GAAG,GAAG,SAAS,eAAe,CAAC;OACzC;MAED,IAAI,IAAI,CAAC,iBAAiB,KAAK,SAAS,EAAE;QACxC,SAAS,GAAG,GAAG,SAAS,oBAAoB,CAAC;OAC9C;MAED,IAAI,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,QAAQ,CAAC,gCAAgC,CAAC,EAAE;QAChE,SAAS,GAAG,wBAAwB,CAAC;OACtC;MACD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;MAE3C,IAAI,QAAQ,CAAC,OAAO,KAAK,eAAe,EAAE;QACxC,OAAO,GAAG,SAAS,KAChB,QAAmC,CAAC,KACvC,aAAa,CAAC;OACf;WAAM;QACL,OAAO,SAAS,CAAC;OAClB;KACF,CAAC;mBA9HA,SAAS;;;oBAYkB,KAAK;;;;;;;;yBA6CA,KAAK;;EAGvC,eAAe,CAAC,CAAQ;IACtB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,CAAC,CAAC,wBAAwB,EAAE,CAAC;KAC9B;GACF;EAiBD,iBAAiB;;IAEf,IAAI,IAAI,CAAC,iBAAiB,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,EAAE;MACtE,IAAI,CAAC,OAAO,GAAG,SAAS,CAAC;KAC1B;GACF;EAED,gBAAgB;IACd,gCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,EACzC,WAAW,CACZ,CAAC;GACH;EAmCD,MAAM;;IAEJ,MAAM,aAAa,GAAG,CAAC,IAAY;MACjC,OAAO,IAAI,KAAK,SAAS,GAAG,IAAI,GAAG,IAAI,CAAC;KACzC,CAAC;;IAGF,MAAM,mBAAmB,GAAG;MAC1B,QACE,WAAK,KAAK,EAAC,gBAAgB,IACzB,WAAK,KAAK,EAAC,aAAa,IACtB,qBAAe,KAAK,EAAC,iBAAiB,IAAE,IAAI,CAAC,KAAK,CAAiB,EAClE,IAAI,CAAC,gBAAgB,KACpB,qBAAe,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,UAAU,IAC9C,IAAI,CAAC,gBAAgB,CACR,CACjB,CACG,EACL,IAAI,CAAC,WAAW,KACf,qBAAe,KAAK,EAAC,uBAAuB,EAAC,OAAO,EAAC,SAAS,IAC3D,IAAI,CAAC,WAAW,CACH,CACjB,CACG,EACN;KACH,CAAC;IAEF,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ;OAC5B,IAED,UACE,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,QAAQ,GAAG,kBAAkB,GAAG,UAAU,mBAClD,GAAG,IAAI,CAAC,QAAQ,EAAE,kBAE/B,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,IAAI,CAAC,aAAa,KAAK,IAAI;UACpD,IAAI;UACJ,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,IAAI,CAAC,aAAa,KAAK,KAAK;YACzD,KAAK;YACL,SAAS,IAGf,iBACE,cAAc,QACd,SAAS,QACT,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EAC9B,QAAQ,EAAE,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,EACtC,MAAM,EAAE,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAClC,GAAG,EAAE,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,EAC5B,cAAc,EACZ,IAAI,CAAC,cAAc,KAAK,SAAS,GAAG,IAAI,CAAC,cAAc,GAAG,IAAI,mBAEjD,GAAG,IAAI,CAAC,QAAQ,EAAE,gBACrB,IAAI,CAAC,oBAAoB,EAAE,mBAErC,IAAI,CAAC,iBAAiB,KAAK,SAAS;UAChC,sBAAsB,IAAI,CAAC,iBAAiB,EAAE;UAC9C,KAAK,mBAGT,IAAI,CAAC,iBAAiB,KAAK,SAAS;QACpC,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,QAAQ,CAAC,gCAAgC,CAAC;UACxD,MAAM;UACN,KAAK,eAGT,IAAI,CAAC,iBAAiB,KAAK,SAAS;UAChC,sBAAsB,IAAI,CAAC,iBAAiB,EAAE;UAC9C,KAAK,IAGX,WAAK,KAAK,EAAC,cAAc,IACtB,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,KAC1B,YAAM,KAAK,EAAC,MAAM,IAChB,YAAM,IAAI,EAAC,MAAM,GAAQ,CACpB,CACR,EACD,EAAC,mBAAmB,OAAG,EACtB,IAAI,CAAC,OAAO,KAAK,QAAQ,KACxB,YACE,KAAK,EAAE;QACL,CAAC,YAAY,GAAG,IAAI;QACpB,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,aAAa;OAC9B,iBACW,MAAM,EAClB,SAAS,EAAEA,SAAK,GAChB,CACH,EACA,IAAI,CAAC,iBAAiB,KAAK,SAAS,KACnC,YACE,KAAK,EAAE,EAAE,CAAC,cAAc,GAAG,IAAI,EAAE,iBACrB,MAAM,EAClB,SAAS,EAAEC,WAAO,GAClB,CACH,CACG,CACI,CACT,CACA,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["Check","Chevron"],"sources":["./src/components/ic-menu-item/ic-menu-item.css?tag=ic-menu-item&encapsulation=shadow","./src/components/ic-menu-item/ic-menu-item.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\nli {\n  list-style: none;\n  padding: 0;\n}\n\n:host::part(button) {\n  color: var(--ic-color-primary-text);\n  padding: calc(var(--ic-space-xxxs) / 2);\n  display: flex;\n  align-items: flex-start;\n  gap: var(--ic-space-xs);\n  border-radius: 0;\n  min-height: 2.5rem;\n  height: auto;\n}\n\n.focus-border {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--ic-space-xs);\n  border-radius: var(--ic-border-radius);\n  margin: calc(var(--ic-space-xxxs) / 2);\n  padding: var(--ic-space-xxs);\n  border: var(--ic-space-xxxs) dashed transparent;\n  --icon-height: auto;\n}\n\n:host(.disabled)::part(button) {\n  color: var(--ic-architectural-200) !important;\n  pointer-events: none;\n}\n\n:host(.disabled) .menu-item-label,\n:host(.disabled) .shortcut,\n:host(.disabled) .menu-item-description {\n  color: var(--ic-architectural-200) !important;\n}\n\n:host([variant=\"destructive\"])::part(button) {\n  color: var(--ic-action-destructive);\n}\n\n:host::part(button):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n:host::part(button):focus-visible,\n:host::part(button):focus {\n  color: var(--ic-color-white-text);\n  background-color: var(--ic-focus-blue);\n  box-shadow: none;\n}\n\n:host(.disabled)::part(button):focus-visible,\n:host(.disabled)::part(button):focus {\n  color: var(--ic-theme-lighten-40) !important;\n}\n\n:host(.disabled) .menu-item-label,\n:host(.disabled) .shortcut,\n:host(.disabled) .menu-item-description {\n  color: var(--ic-architectural-200) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):focus-visible,\n:host([variant=\"destructive\"])::part(button):focus {\n  background-color: var(--ic-action-destructive);\n}\n\nic-button:focus-within .menu-item-label,\nic-button:focus-within .shortcut,\nic-button:focus-within .menu-item-description {\n  color: var(--ic-color-white-text);\n}\n\n:host(.disabled) ic-button:focus-within .focus-border {\n  border-color: var(--ic-architectural-white);\n}\n\n:host(.disabled) ic-button:focus-within .menu-item-label,\n:host(.disabled) ic-button:focus-within .shortcut,\n:host(.disabled) ic-button:focus-within .menu-item-description {\n  color: var(--ic-theme-lighten-40) !important;\n}\n\n:host::part(button):active {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-color-primary-text) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):active {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-action-destructive) !important;\n}\n\n.menu-item-info {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  align-items: baseline;\n  white-space: pre-line;\n  text-align: left;\n}\n\n.menu-labels {\n  display: flex;\n  align-items: baseline;\n  gap: var(--ic-space-xs);\n}\n\n.menu-item-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.shortcut {\n  color: var(--ic-color-tertiary-text);\n  display: flex;\n  flex: min-content;\n}\n\n:host([variant=\"destructive\"]) .menu-item-label {\n  text-transform: uppercase;\n  font-weight: 600;\n  letter-spacing: 0.025em;\n}\n\nic-button:active .menu-item-label {\n  color: var(--ic-color-primary-text);\n}\n\nic-button:active .menu-item-description {\n  color: var(--ic-color-secondary-text);\n}\n\nic-button:active .shortcut {\n  color: var(--ic-color-tertiary-text);\n}\n\n:host([variant=\"destructive\"]) ic-button:active .menu-item-label {\n  color: var(--ic-action-destructive) !important;\n}\n\n.icon,\n.check-icon,\n.submenu-icon,\n.icon ::slotted(svg),\n.check-icon svg,\n.submenu-icon svg {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n.check-icon.hide {\n  visibility: hidden;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  :host::part(button) {\n    border: Canvas;\n  }\n\n  :host::part(button):focus-visible {\n    outline: var(--ic-space-xxxs) solid transparent;\n  }\n\n  .focus-border {\n    border-color: Canvas;\n  }\n\n  :host(.disabled) ic-button:focus-within .focus-border {\n    border-color: GrayText;\n  }\n\n  :host(.disabled) .menu-item-info,\n  :host(.disabled) .menu-item-label,\n  :host(.disabled) .shortcut,\n  :host(.disabled) .menu-item-description,\n  :host(.disabled) ic-button:focus-within .menu-item-info,\n  :host(.disabled) ic-button:focus-within .menu-item-label,\n  :host(.disabled) ic-button:focus-within .shortcut,\n  :host(.disabled) ic-button:focus-within .menu-item-description {\n    color: GrayText !important;\n  }\n\n  :host(.disabled)::part(button):focus-visible,\n  :host(.disabled)::part(button):focus {\n    outline-color: GrayText !important;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Event,\n  EventEmitter,\n  Listen,\n} from \"@stencil/core\";\nimport {\n  getParentElement,\n  isSlotUsed,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcMenuItemVariants } from \"./ic-menu-item.types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport Chevron from \"../../assets/chevron-icon.svg\";\n\n/**\n * @slot icon - Content will be placed to the left of the menu item label.\n */\n\n@Component({\n  tag: \"ic-menu-item\",\n  styleUrl: \"ic-menu-item.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class MenuItem {\n  @Element() el: HTMLIcMenuItemElement;\n\n  /**\n   * The variant of the menu item.\n   */\n  @Prop({ mutable: true, reflect: true }) variant: IcMenuItemVariants =\n    \"default\";\n  /**\n   * The label to display in the menu item.\n   */\n  @Prop() label!: string;\n  /**\n   * The description displayed in the menu item, below the label.\n   */\n  @Prop() description?: string;\n  /**\n   * If `true`, the menu item will be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  /**\n   * The URL that the link points to. This will render the menu item as an \"a\" tag.\n   */\n  @Prop() href?: string;\n  /**\n   * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n   */\n  @Prop() target?: string;\n  /**\n   * The relationship of the linked URL as space-separated link types.\n   */\n  @Prop() rel?: string;\n  /**\n   * The human language of the linked URL.\n   */\n  @Prop() hreflang?: string;\n  /**\n   * How much of the referrer to send when following the link.\n   */\n  @Prop() referrerpolicy?: ReferrerPolicy;\n  /**\n   * The label describing the keyboard shortcut for a menu item's action.\n   */\n  @Prop() keyboardShortcut?: string;\n  /**\n   * This references the popover menu instance that the menu item is a trigger for. If this prop is set, then the variant will always be default.\n   */\n  @Prop() submenuTriggerFor?: string;\n  /**\n   * @internal Emitted when item loses focus.\n   */\n  @Event() childBlur: EventEmitter<void>;\n  /**\n   * @internal Emitted when the user clicks a menu item that triggers a popover menu instance.\n   */\n  @Event() triggerPopoverMenuInstance: EventEmitter<void>;\n  /**\n   * @internal Emitted when the user clicks a menu item.\n   */\n  @Event() handleMenuItemClick: EventEmitter<{\n    label: string;\n    hasSubMenu: boolean;\n  }>;\n\n  @State() toggleChecked: boolean = false;\n\n  @Listen(\"click\", { capture: true })\n  handleHostClick(e: Event): void {\n    if (this.disabled) {\n      e.stopImmediatePropagation();\n    }\n  }\n\n  private handleClick = (e: Event): void => {\n    e.preventDefault();\n    if (this.submenuTriggerFor !== undefined) {\n      this.triggerPopoverMenuInstance.emit();\n    } else if (this.variant === \"toggle\") {\n      this.toggleChecked\n        ? (this.toggleChecked = false)\n        : (this.toggleChecked = true);\n    }\n    this.handleMenuItemClick.emit({\n      label: this.label,\n      hasSubMenu: !!this.el.submenuTriggerFor,\n    });\n  };\n\n  componentWillLoad(): void {\n    // This ensures that trigger menu items are always set to the default variant\n    if (this.submenuTriggerFor !== undefined && this.variant !== \"default\") {\n      this.variant = \"default\";\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Menu Item\"\n    );\n  }\n\n  private getMenuItemAriaLabel = (): string => {\n    let ariaLabel = this.label;\n\n    if (this.description !== undefined) {\n      ariaLabel = `${ariaLabel}, ${this.description}`;\n    }\n\n    if (this.keyboardShortcut !== undefined) {\n      ariaLabel = `${ariaLabel}, ${this.keyboardShortcut}`;\n    }\n\n    if (this.variant === \"destructive\") {\n      ariaLabel = `${ariaLabel}, destructive`;\n    }\n\n    if (this.submenuTriggerFor !== undefined) {\n      ariaLabel = `${ariaLabel}, triggers submenu`;\n    }\n\n    if (this.el.classList.contains(\"ic-popover-submenu-back-button\")) {\n      ariaLabel = \"Go back to parent menu\";\n    }\n    const parentEl = getParentElement(this.el);\n\n    if (parentEl.tagName === \"IC-MENU-GROUP\") {\n      return `${ariaLabel}, ${\n        (parentEl as HTMLIcMenuGroupElement).label\n      } menu group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  render() {\n    // A helper function that checks if a prop has been defined\n    const isPropDefined = (prop: string) => {\n      return prop !== undefined ? prop : null;\n    };\n\n    // A sub-component to layout the menu information correctly in ic-button\n    const MenuItemInformation = () => {\n      return (\n        <div class=\"menu-item-info\">\n          <div class=\"menu-labels\">\n            <ic-typography class=\"menu-item-label\">{this.label}</ic-typography>\n            {this.keyboardShortcut && (\n              <ic-typography variant=\"caption\" class=\"shortcut\">\n                {this.keyboardShortcut}\n              </ic-typography>\n            )}\n          </div>\n          {this.description && (\n            <ic-typography class=\"menu-item-description\" variant=\"caption\">\n              {this.description}\n            </ic-typography>\n          )}\n        </div>\n      );\n    };\n\n    return (\n      <Host\n        class={{\n          [\"disabled\"]: this.disabled,\n        }}\n      >\n        <li\n          role={this.variant === \"toggle\" ? \"menuitemcheckbox\" : \"menuitem\"}\n          aria-disabled={`${this.disabled}`}\n          aria-checked={\n            this.variant === \"toggle\" && this.toggleChecked === true\n              ? true\n              : this.variant === \"toggle\" && this.toggleChecked === false\n              ? false\n              : undefined\n          }\n        >\n          <ic-button\n            disableTooltip\n            fullWidth\n            variant=\"tertiary\"\n            onClick={this.handleClick}\n            href={isPropDefined(this.href)}\n            hreflang={isPropDefined(this.hreflang)}\n            target={isPropDefined(this.target)}\n            rel={isPropDefined(this.rel)}\n            referrerpolicy={\n              this.referrerpolicy !== undefined ? this.referrerpolicy : null\n            }\n            aria-disabled={`${this.disabled}`}\n            aria-label={this.getMenuItemAriaLabel()}\n            aria-controls={\n              this.submenuTriggerFor !== undefined\n                ? `ic-popover-submenu-${this.submenuTriggerFor}`\n                : false\n            }\n            aria-haspopup={\n              this.submenuTriggerFor !== undefined ||\n              this.el.classList.contains(\"ic-popover-submenu-back-button\")\n                ? \"menu\"\n                : false\n            }\n            aria-owns={\n              this.submenuTriggerFor !== undefined\n                ? `ic-popover-submenu-${this.submenuTriggerFor}`\n                : false\n            }\n          >\n            <div class=\"focus-border\">\n              {isSlotUsed(this.el, \"icon\") && (\n                <span class=\"icon\">\n                  <slot name=\"icon\"></slot>\n                </span>\n              )}\n              <MenuItemInformation />\n              {this.variant === \"toggle\" && (\n                <span\n                  class={{\n                    [\"check-icon\"]: true,\n                    [\"hide\"]: !this.toggleChecked,\n                  }}\n                  aria-hidden=\"true\"\n                  innerHTML={Check}\n                />\n              )}\n              {this.submenuTriggerFor !== undefined && (\n                <span\n                  class={{ [\"submenu-icon\"]: true }}\n                  aria-hidden=\"true\"\n                  innerHTML={Chevron}\n                />\n              )}\n            </div>\n          </ic-button>\n        </li>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/ic-menu2.js

@@ -4,13 +4,12 @@ import { a as onComponentRequiredPropUndefined } from './helpers.js';
 import { d as defineCustomElement$1 } from './ic-typography2.js';
 import { c as createPopper } from './popper.js';
 
-const icMenuCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){:host([open]) .menu{transition:max-height var(--ic-transition-duration-slow)}}:host{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)}:host(:not(.no-focus):focus-within){box-shadow:var(--ic-border-focus)}.menu{text-decoration:none;list-style-type:none;border:0.063rem 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{overflow-y:auto}.menu:focus-visible{outline:none}:host([open]){max-height:none;display:block}:host([open]) .menu{visibility:visible;max-height:20.125rem}:host(.full-width){width:100%}.option{padding:0.5rem 0.438rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center}:host([small]) .option{padding:0.25rem 0.438rem}.option:last-child{border-radius:0 0 0.063rem 0.063rem}.option:first-child{border-radius:0.063rem 0.063rem 0 0}.option:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option:focus-visible{outline:var(--ic-hc-focus-outline)}.option:not(.disabled-option) .option-description{color:var(--ic-color-secondary-text)}.option-text-container{pointer-events:none}.check-icon{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:0.5rem;pointer-events:none}.focused-option .check-icon *{fill:currentcolor}.option-group-title{padding:1.5rem 0.438rem 0.5rem;color:var(--ic-color-tertiary-text)}:host([small]) .option-group-title{padding:0.75rem 0.438rem 0.25rem}.last-recommended-option{border-bottom:0.063rem solid var(--ic-architectural-400)}.disabled-option{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option,.focused-option .option-description{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}:host(.no-results) li{cursor:no-drop}:host(.no-results) li:hover{background-color:transparent}@media (forced-colors: active){.focused-option: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)}.menu.sc-ic-menu{text-decoration:none;list-style-type:none;border:0.063rem 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;justify-content:space-between;align-items:center}[small].sc-ic-menu-h .option.sc-ic-menu{padding:0.25rem 0.438rem}.option.sc-ic-menu:last-child{border-radius:0 0 0.063rem 0.063rem}.option.sc-ic-menu:first-child{border-radius:0.063rem 0.063rem 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}.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:0.063rem solid var(--ic-architectural-400)}.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 Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
-    this.__attachShadow();
     this.menuOptionSelect = createEvent(this, "menuOptionSelect", 7);
     this.menuStateChange = createEvent(this, "menuStateChange", 7);
     this.menuOptionId = createEvent(this, "menuOptionId", 7);
@@ -107,7 +106,7 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     this.manSetInputValueKeyboardOpen = (event) => {
       const highlightedOptionIndex = this.options.findIndex((option) => option.value === this.optionHighlighted);
-      const getOptionId = (index) => Array.from(this.host.shadowRoot.querySelectorAll("li"))[index].id;
+      const getOptionId = (index) => Array.from(this.host.querySelectorAll("li"))[index].id;
       switch (event.key) {
         case "ArrowDown":
           this.arrowBehaviour(event);
@@ -281,7 +280,11 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       }
     };
     this.getSortedOptions = (options) => {
-      return options.sort((optionA, optionB) => optionA.recommended && !optionB.recommended ? -1 : 0);
+      let sorted = [];
+      if (options.sort) {
+        sorted = options.sort((optionA, optionB) => optionA.recommended && !optionB.recommended ? -1 : 0);
+      }
+      return sorted;
     };
     this.isManualMode = this.activationType === "manual";
     this.scrollToSelected = (menu) => {
@@ -296,7 +299,7 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       }
     };
     this.loadUngroupedOptions = () => {
-      if (this.options.length > 0) {
+      if (this.options.length > 0 && this.options.map) {
         this.options.map((option) => {
           if (option.children) {
             option.children.map((option) => !option.disabled && this.ungroupedOptions.push(option));
@@ -311,7 +314,7 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     this.setMenuScrollbar = () => {
       let optionsHeight = 0;
-      this.host.shadowRoot
+      this.host
         .querySelectorAll(".option")
         .forEach((option) => (optionsHeight += option.clientHeight));
       if (optionsHeight >= 320) {
@@ -460,7 +463,7 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       else if (optionHighlightedIsSet &&
         !this.focusFromSearchKeypress &&
         !this.preventIncorrectTabOrder) {
-        const highlightedEl = this.host.shadowRoot.querySelector(`li[data-value="${this.optionHighlighted}"]`);
+        const highlightedEl = this.host.querySelector(`li[data-value="${this.optionHighlighted}"]`);
         if (highlightedEl) {
           highlightedEl.focus();
         }
@@ -498,7 +501,7 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "options": ["watchOptionsHandler"]
   }; }
   static get style() { return icMenuCss; }
-}, [1, "ic-menu", {
+}, [2, "ic-menu", {
     "open": [516],
     "options": [16],
     "small": [516],

package/dist/components/ic-menu2.js.map

@@ -1 +1 @@
-{"file":"ic-menu2.js","mappings":"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","names":["Check"],"sources":["./src/components/ic-menu/ic-menu.css?tag=ic-menu&encapsulation=shadow","./src/components/ic-menu/ic-menu.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-menu: z-index of menu\n */\n\n@media (prefers-reduced-motion: no-preference) {\n  :host([open]) .menu {\n    transition: max-height var(--ic-transition-duration-slow);\n  }\n}\n\n:host {\n  border-radius: var(--ic-border-radius);\n  max-height: 0;\n  width: var(--input-width, 20rem);\n  color: var(--ic-color-primary-text);\n  background-color: var(--ic-architectural-white);\n  position: relative;\n  z-index: var(--ic-z-index-menu);\n  box-sizing: border-box;\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(:not(.no-focus):focus-within) {\n  box-shadow: var(--ic-border-focus);\n}\n\n.menu {\n  text-decoration: none;\n  list-style-type: none;\n  border: 0.063rem solid var(--ic-architectural-400);\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-architectural-white);\n  visibility: hidden;\n  max-height: 0;\n  overflow-y: hidden;\n}\n\n.menu-scroll {\n  overflow-y: auto;\n}\n\n.menu:focus-visible {\n  outline: none;\n}\n\n:host([open]) {\n  max-height: none;\n  display: block;\n}\n\n:host([open]) .menu {\n  visibility: visible;\n  max-height: 20.125rem;\n}\n\n:host(.full-width) {\n  width: 100%;\n}\n\n.option {\n  padding: 0.5rem 0.438rem;\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n:host([small]) .option {\n  padding: 0.25rem 0.438rem;\n}\n\n.option:last-child {\n  border-radius: 0 0 0.063rem 0.063rem;\n}\n\n.option:first-child {\n  border-radius: 0.063rem 0.063rem 0 0;\n}\n\n.option:not(.disabled-option):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n.option:not(.disabled-option):active {\n  background-color: var(--ic-action-dark-bg-active);\n}\n\n.option:focus-visible {\n  outline: var(--ic-hc-focus-outline);\n}\n\n.option:not(.disabled-option) .option-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.option-text-container {\n  pointer-events: none;\n}\n\n.check-icon {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  margin-left: 0.5rem;\n  pointer-events: none;\n}\n\n.focused-option .check-icon * {\n  fill: currentcolor;\n}\n\n.option-group-title {\n  padding: 1.5rem 0.438rem 0.5rem;\n  color: var(--ic-color-tertiary-text);\n}\n\n:host([small]) .option-group-title {\n  padding: 0.75rem 0.438rem 0.25rem;\n}\n\n.last-recommended-option {\n  border-bottom: 0.063rem solid var(--ic-architectural-400);\n}\n\n.disabled-option {\n  color: var(--ic-architectural-200);\n  cursor: default;\n  pointer-events: none;\n}\n\n.focused-option,\n.focused-option .option-description {\n  background-color: var(--ic-focus-blue) !important;\n  color: var(--ic-color-white-text) !important;\n}\n\n:host(.no-results) li {\n  cursor: no-drop;\n}\n\n:host(.no-results) li:hover {\n  background-color: transparent;\n}\n\n@media (forced-colors: active) {\n  .focused-option:focus {\n    outline: none;\n    border: 0.125rem solid transparent;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Method,\n  State,\n  Watch,\n} from \"@stencil/core\";\nimport { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\n\nimport { IcActivationTypes, IcMenuOption } from \"../../utils/types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\nimport {\n  IcOptionSelectEventDetail,\n  IcMenuChangeEventDetail,\n  IcMenuOptionIdEventDetail,\n} from \"./ic-menu.types\";\n\n@Component({\n  tag: \"ic-menu\",\n  styleUrl: \"ic-menu.css\",\n  shadow: true,\n})\nexport class Menu {\n  @Element() host: HTMLIcMenuElement;\n\n  /**\n   * If `true`, the menu will be displayed open.\n   */\n  @Prop({ reflect: true }) open!: boolean;\n\n  /**\n   * The possible menu selection options.\n   */\n  @Prop() options!: IcMenuOption[];\n\n  /**\n   * If `true`, the small styling will be applied to the menu.\n   */\n  @Prop({ reflect: true }) small?: boolean = false;\n\n  /**\n   * The ID of the menu.\n   */\n  @Prop() menuId!: string;\n\n  /**\n   * The value of the currently selected option.\n   */\n  @Prop() value!: string;\n\n  /**\n   * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.\n   */\n  @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n  /**\n   * The reference to the input element.\n   */\n  @Prop() inputEl!: HTMLElement;\n\n  /**\n   * @internal - The parent element if ic-menu is nested inside another component.\n   */\n  @Prop() parentEl?: HTMLElement;\n\n  /**\n   * The label for the input element.\n   */\n  @Prop() inputLabel!: string;\n\n  /**\n   * The reference to an anchor element the menu will position itself from when rendered.\n   */\n  @Prop() anchorEl!: HTMLElement;\n\n  /**\n   *  If `true`, the menu will fill the width of the container.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * @internal If `true`, autofocus will be applied on selected item when menu is open.\n   */\n  @Prop() autoFocusOnSelected: boolean = true;\n\n  @State() keyboardNav: boolean = false;\n  @State() optionHighlighted: string;\n  @State() focusFromSearchKeypress: boolean = false;\n  @State() initialOptionsListRender: boolean = false;\n  @State() preventIncorrectTabOrder: boolean = false;\n\n  @Watch(\"options\")\n  watchOptionsHandler(): void {\n    this.ungroupedOptions = [];\n    this.loadUngroupedOptions();\n  }\n\n  /**\n   * @internal Emitted when an option is selected.\n   */\n  @Event() menuOptionSelect!: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * @internal Emitted when state of menu changes (i.e. open or close).\n   */\n  @Event() menuStateChange!: EventEmitter<IcMenuChangeEventDetail>;\n\n  /**\n   * @internal Emitted when an option has been highlighted\n   */\n  @Event() menuOptionId: EventEmitter<IcMenuOptionIdEventDetail>;\n\n  /**\n   * @internal Emitted when key is pressed while menu is open\n   */\n  @Event() menuKeyPress: EventEmitter<{ isNavKey: boolean; key: string }>;\n\n  /**\n   * @internal Emitted when the ungrouped options have been set.\n   */\n  @Event() ungroupedOptionsSet: EventEmitter<{ options: IcMenuOption[] }>;\n\n  private handleClearListener = (): void => {\n    this.optionHighlighted = \"\";\n  };\n\n  private handleSubmitSearch = (): void => {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    this.setInputValue(highlightedOptionIndex);\n  };\n\n  private menu: HTMLUListElement;\n  private ungroupedOptions: IcMenuOption[] = [];\n  private popperInstance: PopperInstance;\n\n  // Prevents menu re-opening immediately after it is closed on blur when clicking input\n  private preventClickOpen: boolean = false;\n  private isSearchBar: boolean = false;\n\n  private handleMenuChange = (open: boolean, focusInput?: boolean): void => {\n    if (!open) this.popperInstance.destroy();\n    this.menuStateChange.emit({ open, focusInput });\n\n    if (!open && focusInput !== false) {\n      this.inputEl.focus();\n      this.preventClickOpen = false;\n    }\n  };\n\n  private setNextOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex + 1]) {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex + 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex + 1].value\n        ),\n      });\n    } else {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[0].value,\n        optionId: this.getOptionId(this.ungroupedOptions[0].value),\n      });\n    }\n  };\n\n  private setPreviousOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex - 1]) {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex - 1].value\n        ),\n      });\n    } else {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[this.ungroupedOptions.length - 1].value\n        ),\n      });\n    }\n  };\n\n  /**\n   * @internal If menu is opened with the mouse, emit menuStateChange custom event.\n   */\n  @Method()\n  async handleClickOpen(): Promise<void> {\n    if (!this.preventClickOpen) {\n      this.menuStateChange.emit({ open: !this.open });\n      this.keyboardNav = false;\n    }\n    this.preventClickOpen = false;\n  }\n\n  /**\n   * Used alongside activationType\n   * If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.\n   * @param {KeyboardEvent} event - keyboard event\n   */\n  @Method()\n  async handleKeyboardOpen(event: KeyboardEvent): Promise<void> {\n    this.keyboardNav = false;\n\n    if (this.activationType === \"automatic\") {\n      this.autoSetInputValueKeyboardOpen(event);\n    } else {\n      this.keyboardNav = true;\n      this.manSetInputValueKeyboardOpen(event);\n    }\n  }\n\n  /**\n   * @internal Used to highlight the first option in the menu.\n   */\n  @Method()\n  async handleSetFirstOption(): Promise<void> {\n    this.setHighlightedOption(0);\n  }\n\n  private arrowBehaviour = (event: KeyboardEvent): void => {\n    event.preventDefault();\n    this.handleMenuChange(true);\n  };\n\n  private setHighlightedOption = (highlightedIndex: number): void => {\n    this.optionHighlighted = this.options[highlightedIndex].value || undefined;\n  };\n\n  private autoSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    this.keyboardNav = false;\n\n    const isSearchableSelect = this.inputEl?.tagName === \"INPUT\";\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setNextOptionValue(selectedOptionIndex);\n        break;\n      case \"ArrowUp\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setPreviousOptionValue(selectedOptionIndex);\n        break;\n      case \" \":\n      case \"Enter\":\n        if ((event.target as HTMLElement).id !== \"clear-button\") {\n          this.handleMenuChange(true);\n        }\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        break;\n    }\n  };\n\n  private manSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    const getOptionId = (index: number): string =>\n      Array.from(this.host.shadowRoot.querySelectorAll(\"li\"))[index].id;\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.arrowBehaviour(event);\n        if (highlightedOptionIndex < this.options.length - 1) {\n          this.setHighlightedOption(highlightedOptionIndex + 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex + 1),\n          });\n        } else {\n          this.setHighlightedOption(0);\n          this.menuOptionId.emit({\n            optionId: getOptionId(0),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"ArrowUp\":\n        this.arrowBehaviour(event);\n        if (\n          highlightedOptionIndex <= 0 ||\n          highlightedOptionIndex > this.options.length + 1\n        ) {\n          this.setHighlightedOption(this.options.length - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(this.options.length - 1),\n          });\n        } else {\n          this.setHighlightedOption(highlightedOptionIndex - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex - 1),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"Enter\":\n        event.preventDefault();\n        this.setInputValue(highlightedOptionIndex);\n        break;\n      case \"Escape\":\n        this.handleMenuChange(false);\n        this.menuOptionId.emit({ optionId: undefined });\n        break;\n      case \"Shift\":\n      case \"Tab\":\n        this.preventIncorrectTabOrder = true;\n        break;\n      case \"Backspace\":\n        if (this.isSearchBar) {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n      default:\n        if (this.isSearchBar && event.key !== \"Tab\") {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n    }\n  };\n\n  private setInputValue = (highlightedOptionIndex: number) => {\n    if (this.options[highlightedOptionIndex]) {\n      this.menuOptionSelect.emit({\n        value: this.options[highlightedOptionIndex]?.value,\n      });\n      this.optionHighlighted = undefined;\n      this.menuOptionId.emit({ optionId: undefined });\n    }\n    this.handleMenuChange(false);\n  };\n\n  private handleOptionClick = (event: Event): void => {\n    const { value, label } = (event.target as HTMLLIElement).dataset;\n    this.menuOptionSelect.emit({ value, label });\n    this.handleMenuChange(false);\n  };\n\n  private handleBlur = (event: FocusEvent): void => {\n    if (event.relatedTarget !== this.inputEl) {\n      if (!this.menu.contains(event.relatedTarget as HTMLElement)) {\n        this.handleMenuChange(false, false);\n      }\n    } else {\n      this.handleMenuChange(false);\n      this.preventClickOpen = true;\n    }\n  };\n\n  private handleMouseDown = (event: Event): void => {\n    event.preventDefault();\n  };\n\n  private handleMenuKeyDown = (event: KeyboardEvent) => {\n    if (this.activationType === \"automatic\") {\n      this.autoSetValueOnMenuKeyDown(event);\n    }\n  };\n\n  private emitMenuKeyPress = (isNavKey: boolean, key: string) => {\n    this.menuKeyPress.emit({ isNavKey: isNavKey, key: key });\n  };\n\n  private autoSetValueOnMenuKeyDown = (event: KeyboardEvent): void => {\n    event.cancelBubble = true;\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    const isSearchableSelect = this.inputEl.tagName === \"INPUT\";\n\n    this.keyboardNav = false;\n\n    switch (event.key) {\n      case \"ArrowUp\":\n        event.preventDefault();\n        this.setPreviousOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"ArrowDown\":\n        event.preventDefault();\n        this.setNextOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"Home\":\n        this.menuOptionSelect.emit({\n          value: this.ungroupedOptions[0].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \"End\":\n        this.menuOptionSelect.emit({\n          value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \"Enter\":\n      case \"Escape\":\n        this.handleMenuChange(false);\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      case \"Shift\":\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        if (event.key.length === 1) {\n          this.keyboardNav = true;\n        }\n        break;\n    }\n    this.emitMenuKeyPress(this.keyboardNav, event.key);\n  };\n\n  private handleMenuKeyUp = (event: KeyboardEvent): void => {\n    if (event.key === \"Tab\" && event.shiftKey) {\n      this.preventClickOpen = false;\n    }\n  };\n\n  private getOptionId = (value: string): string => {\n    return `${this.menuId}-${value}`;\n  };\n\n  private getOptionAriaLabel = (\n    option: IcMenuOption,\n    parentOption: IcMenuOption\n  ): string => {\n    let ariaLabel = option.label;\n\n    if (option.description) {\n      ariaLabel = `${ariaLabel}, ${option.description}`;\n    }\n\n    if (parentOption) {\n      return `${ariaLabel}, ${parentOption.label} group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  private getSortedOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n    return options.sort((optionA, optionB) =>\n      optionA.recommended && !optionB.recommended ? -1 : 0\n    );\n  };\n\n  private isManualMode = this.activationType === \"manual\";\n\n  private scrollToSelected = (menu: HTMLUListElement) => {\n    const selectedOption = menu.querySelector(\n      \".option[aria-selected]\"\n    ) as HTMLElement;\n\n    if (selectedOption) {\n      const elTop = selectedOption.offsetTop + selectedOption.offsetHeight;\n      if (\n        elTop > menu.scrollTop + menu.offsetHeight ||\n        elTop < menu.scrollTop + menu.offsetHeight\n      ) {\n        menu.scrollTop = selectedOption.offsetTop;\n      }\n      selectedOption.focus();\n    }\n  };\n\n  private loadUngroupedOptions = () => {\n    if (this.options.length > 0) {\n      this.options.map((option) => {\n        if (option.children) {\n          option.children.map(\n            (option) => !option.disabled && this.ungroupedOptions.push(option)\n          );\n        } else if (!option.disabled) {\n          this.ungroupedOptions.push(option);\n        }\n      });\n    }\n    this.ungroupedOptions = this.getSortedOptions(this.ungroupedOptions);\n    this.ungroupedOptionsSet.emit({ options: this.ungroupedOptions });\n  };\n\n  private setMenuScrollbar = () => {\n    let optionsHeight = 0;\n    this.host.shadowRoot\n      .querySelectorAll(\".option\")\n      .forEach((option) => (optionsHeight += option.clientHeight));\n\n    if (optionsHeight >= 320) {\n      this.menu.classList.add(\"menu-scroll\");\n    }\n  };\n\n  connectedCallback(): void {\n    if (this.parentEl?.tagName === \"IC-SEARCH-BAR\") {\n      this.setHighlightedOption(0);\n      this.initialOptionsListRender = true;\n    }\n  }\n\n  componentWillLoad(): void {\n    this.loadUngroupedOptions();\n    this.isSearchBar = this.parentEl.tagName === \"IC-SEARCH-BAR\";\n    this.parentEl.addEventListener(\"icClear\", this.handleClearListener);\n    this.parentEl.addEventListener(\"icSubmitSearch\", this.handleSubmitSearch);\n  }\n\n  componentDidLoad(): void {\n    if (\n      this.isSearchBar &&\n      (this.parentEl as HTMLIcSearchBarElement).disableFilter\n    ) {\n      this.focusFromSearchKeypress = true;\n    }\n\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.open, propName: \"open\" },\n        { prop: this.options, propName: \"options\" },\n        { prop: this.menuId, propName: \"menu-id\" },\n        { prop: this.inputLabel, propName: \"input-label\" },\n        //NOTE: no check for value, input-el or anchor-el as otherwise get console errors on first load of select component\n      ],\n      \"Menu\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.open) {\n      this.popperInstance = createPopper(this.anchorEl, this.host, {\n        placement: \"bottom\",\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 7],\n            },\n          },\n          {\n            name: \"flip\",\n            options: {\n              fallbackPlacements: [\"top\"],\n              rootBoundary: \"viewport\",\n            },\n          },\n        ],\n      });\n    }\n\n    if (this.open && !!this.options.length) {\n      this.setMenuScrollbar();\n    }\n  }\n\n  componentDidUpdate(): void {\n    const inputValueInOptions: boolean = this.options.some(\n      (option) => option.value === this.value\n    );\n\n    const optionHighlightedIsSet =\n      this.optionHighlighted !== null &&\n      this.optionHighlighted !== undefined &&\n      this.optionHighlighted !== \"\";\n\n    if (this.open && this.options.length !== 0) {\n      if (\n        this.value &&\n        this.keyboardNav &&\n        inputValueInOptions &&\n        this.autoFocusOnSelected\n      ) {\n        this.scrollToSelected(this.menu);\n      } else if (\n        this.inputEl.tagName !== \"IC-TEXT-FIELD\" &&\n        this.inputEl.tagName !== \"INPUT\"\n      ) {\n        this.menu.focus();\n      } else if (\n        optionHighlightedIsSet &&\n        !this.focusFromSearchKeypress &&\n        !this.preventIncorrectTabOrder\n      ) {\n        const highlightedEl = this.host.shadowRoot.querySelector(\n          `li[data-value=\"${this.optionHighlighted}\"]`\n        ) as HTMLElement;\n\n        if (highlightedEl) {\n          highlightedEl.focus();\n        }\n      }\n    }\n  }\n\n  disconnectedCallback(): void {\n    this.parentEl.removeEventListener(\"icClear\", this.handleClearListener);\n    this.parentEl.removeEventListener(\n      \"icSubmitSearch\",\n      this.handleSubmitSearch\n    );\n  }\n\n  private displayOption = (\n    option: IcMenuOption,\n    index?: number,\n    parentOption?: IcMenuOption\n  ): HTMLLIElement => {\n    const { open, value } = this;\n\n    return (\n      <li\n        id={this.getOptionId(option.value)}\n        class={{\n          option: true,\n          \"focused-option\": this.isManualMode\n            ? (this.keyboardNav || this.initialOptionsListRender) &&\n              option.value === this.optionHighlighted\n            : this.keyboardNav && option.value === value,\n          \"last-recommended-option\":\n            option.recommended &&\n            this.options[index + 1] &&\n            !this.options[index + 1].recommended,\n          \"disabled-option\": option.disabled,\n        }}\n        role=\"option\"\n        tabindex={\n          open &&\n          (option.value === value || option.value === this.optionHighlighted) &&\n          this.keyboardNav\n            ? \"0\"\n            : \"-1\"\n        }\n        aria-label={this.getOptionAriaLabel(option, parentOption)}\n        aria-selected={option.value === value}\n        aria-disabled={option.disabled ? \"true\" : \"false\"}\n        onClick={this.handleOptionClick}\n        onBlur={this.handleBlur}\n        onMouseDown={this.handleMouseDown}\n        data-value={option.value}\n        data-label={option.label}\n      >\n        <div class=\"option-text-container\">\n          <ic-typography variant=\"body\" aria-hidden=\"true\">\n            <p>{option.label}</p>\n          </ic-typography>\n          {option.description && (\n            <ic-typography\n              id={`${this.getOptionId(option.value)}-description`}\n              class=\"option-description\"\n              variant=\"caption\"\n              aria-hidden=\"true\"\n            >\n              <p>{option.description}</p>\n            </ic-typography>\n          )}\n        </div>\n        {option?.value.toLowerCase() === value?.toLowerCase() &&\n          this.parentEl.tagName !== \"IC-SEARCH-BAR\" && (\n            <span class=\"check-icon\" innerHTML={Check} />\n          )}\n      </li>\n    );\n  };\n\n  render() {\n    const { inputLabel, options, menuId, value, fullWidth } = this;\n\n    return (\n      <Host\n        class={{\n          \"full-width\": fullWidth,\n          \"no-focus\": this.inputEl?.tagName === \"INPUT\",\n        }}\n      >\n        {options.length !== 0 && (\n          <ul\n            id={menuId}\n            class=\"menu\"\n            role=\"listbox\"\n            aria-label={inputLabel}\n            aria-activedescendant={\n              value != null && value !== \"\" ? this.getOptionId(value) : \"\"\n            }\n            tabindex={\n              open && !this.keyboardNav && this.inputEl?.tagName !== \"INPUT\"\n                ? \"0\"\n                : \"-1\"\n            }\n            ref={(el) => (this.menu = el)}\n            onKeyDown={this.handleMenuKeyDown}\n            onKeyUp={this.handleMenuKeyUp}\n            onBlur={this.handleBlur}\n          >\n            {this.getSortedOptions(options).map((option, index) => {\n              if (option.children) {\n                if (option.children.length > 0) {\n                  return (\n                    <div>\n                      <ic-typography\n                        class=\"option-group-title\"\n                        role=\"presentation\"\n                        variant=\"subtitle-small\"\n                      >\n                        <p>{option.label}</p>\n                      </ic-typography>\n                      {option.children.map((childOption) =>\n                        this.displayOption(childOption, index, option)\n                      )}\n                    </div>\n                  );\n                } else {\n                  return null;\n                }\n              } else {\n                return this.displayOption(option, index);\n              }\n            })}\n          </ul>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ic-menu2.js","mappings":"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","names":["Check"],"sources":["./src/components/ic-menu/ic-menu.css?tag=ic-menu&encapsulation=scoped","./src/components/ic-menu/ic-menu.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-menu: z-index of menu\n */\n\n@media (prefers-reduced-motion: no-preference) {\n  :host([open]) .menu {\n    transition: max-height var(--ic-transition-duration-slow);\n  }\n}\n\n:host {\n  border-radius: var(--ic-border-radius);\n  max-height: 0;\n  width: var(--input-width, 20rem);\n  color: var(--ic-color-primary-text);\n  background-color: var(--ic-architectural-white);\n  position: relative;\n  z-index: var(--ic-z-index-menu);\n  box-sizing: border-box;\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(:not(.no-focus):focus-within) {\n  box-shadow: var(--ic-border-focus);\n}\n\n.menu {\n  text-decoration: none;\n  list-style-type: none;\n  border: 0.063rem solid var(--ic-architectural-400);\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-architectural-white);\n  visibility: hidden;\n  max-height: 0;\n  overflow-y: hidden;\n}\n\n.menu-scroll {\n  overflow-y: auto;\n}\n\n.menu:focus-visible {\n  outline: none;\n}\n\n:host([open]) {\n  max-height: none;\n  display: block;\n}\n\n:host([open]) .menu {\n  visibility: visible;\n  max-height: 20.125rem;\n}\n\n:host(.full-width) {\n  width: 100%;\n}\n\n.option {\n  padding: 0.5rem 0.438rem;\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n:host([small]) .option {\n  padding: 0.25rem 0.438rem;\n}\n\n.option:last-child {\n  border-radius: 0 0 0.063rem 0.063rem;\n}\n\n.option:first-child {\n  border-radius: 0.063rem 0.063rem 0 0;\n}\n\n.option:not(.disabled-option):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n.option:not(.disabled-option):active {\n  background-color: var(--ic-action-dark-bg-active);\n}\n\n.option:focus-visible {\n  outline: var(--ic-hc-focus-outline);\n}\n\n.option:not(.disabled-option) .option-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.option-text-container {\n  pointer-events: none;\n}\n\n.check-icon {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  margin-left: 0.5rem;\n  pointer-events: none;\n}\n\n.focused-option .check-icon * {\n  fill: currentcolor;\n}\n\n.option-group-title {\n  padding: 1.5rem 0.438rem 0.5rem;\n  color: var(--ic-color-tertiary-text);\n}\n\n:host([small]) .option-group-title {\n  padding: 0.75rem 0.438rem 0.25rem;\n}\n\n.last-recommended-option {\n  border-bottom: 0.063rem solid var(--ic-architectural-400);\n}\n\n.disabled-option {\n  color: var(--ic-architectural-200);\n  cursor: default;\n  pointer-events: none;\n}\n\n.focused-option,\n.focused-option .option-description {\n  background-color: var(--ic-focus-blue) !important;\n  color: var(--ic-color-white-text) !important;\n}\n\n:host(.no-results) li {\n  cursor: no-drop;\n}\n\n:host(.no-results) li:hover {\n  background-color: transparent;\n}\n\n@media (forced-colors: active) {\n  .focused-option:focus {\n    outline: none;\n    border: 0.125rem solid transparent;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Method,\n  State,\n  Watch,\n} from \"@stencil/core\";\nimport { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\n\nimport { IcActivationTypes, IcMenuOption } from \"../../utils/types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport { onComponentRequiredPropUndefined } from \"../../utils/helpers\";\nimport {\n  IcOptionSelectEventDetail,\n  IcMenuChangeEventDetail,\n  IcMenuOptionIdEventDetail,\n} from \"./ic-menu.types\";\n\n@Component({\n  tag: \"ic-menu\",\n  styleUrl: \"ic-menu.css\",\n  scoped: true,\n})\nexport class Menu {\n  @Element() host: HTMLIcMenuElement;\n\n  /**\n   * If `true`, the menu will be displayed open.\n   */\n  @Prop({ reflect: true }) open!: boolean;\n\n  /**\n   * The possible menu selection options.\n   */\n  @Prop() options!: IcMenuOption[];\n\n  /**\n   * If `true`, the small styling will be applied to the menu.\n   */\n  @Prop({ reflect: true }) small?: boolean = false;\n\n  /**\n   * The ID of the menu.\n   */\n  @Prop() menuId!: string;\n\n  /**\n   * The value of the currently selected option.\n   */\n  @Prop() value!: string;\n\n  /**\n   * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.\n   */\n  @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n  /**\n   * The reference to the input element.\n   */\n  @Prop() inputEl!: HTMLElement;\n\n  /**\n   * @internal - The parent element if ic-menu is nested inside another component.\n   */\n  @Prop() parentEl?: HTMLElement;\n\n  /**\n   * The label for the input element.\n   */\n  @Prop() inputLabel!: string;\n\n  /**\n   * The reference to an anchor element the menu will position itself from when rendered.\n   */\n  @Prop() anchorEl!: HTMLElement;\n\n  /**\n   *  If `true`, the menu will fill the width of the container.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * @internal If `true`, autofocus will be applied on selected item when menu is open.\n   */\n  @Prop() autoFocusOnSelected: boolean = true;\n\n  @State() keyboardNav: boolean = false;\n  @State() optionHighlighted: string;\n  @State() focusFromSearchKeypress: boolean = false;\n  @State() initialOptionsListRender: boolean = false;\n  @State() preventIncorrectTabOrder: boolean = false;\n\n  @Watch(\"options\")\n  watchOptionsHandler(): void {\n    this.ungroupedOptions = [];\n    this.loadUngroupedOptions();\n  }\n\n  /**\n   * @internal Emitted when an option is selected.\n   */\n  @Event() menuOptionSelect!: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * @internal Emitted when state of menu changes (i.e. open or close).\n   */\n  @Event() menuStateChange!: EventEmitter<IcMenuChangeEventDetail>;\n\n  /**\n   * @internal Emitted when an option has been highlighted\n   */\n  @Event() menuOptionId: EventEmitter<IcMenuOptionIdEventDetail>;\n\n  /**\n   * @internal Emitted when key is pressed while menu is open\n   */\n  @Event() menuKeyPress: EventEmitter<{ isNavKey: boolean; key: string }>;\n\n  /**\n   * @internal Emitted when the ungrouped options have been set.\n   */\n  @Event() ungroupedOptionsSet: EventEmitter<{ options: IcMenuOption[] }>;\n\n  private handleClearListener = (): void => {\n    this.optionHighlighted = \"\";\n  };\n\n  private handleSubmitSearch = (): void => {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    this.setInputValue(highlightedOptionIndex);\n  };\n\n  private menu: HTMLUListElement;\n  private ungroupedOptions: IcMenuOption[] = [];\n  private popperInstance: PopperInstance;\n\n  // Prevents menu re-opening immediately after it is closed on blur when clicking input\n  private preventClickOpen: boolean = false;\n  private isSearchBar: boolean = false;\n\n  private handleMenuChange = (open: boolean, focusInput?: boolean): void => {\n    if (!open) this.popperInstance.destroy();\n    this.menuStateChange.emit({ open, focusInput });\n\n    if (!open && focusInput !== false) {\n      this.inputEl.focus();\n      this.preventClickOpen = false;\n    }\n  };\n\n  private setNextOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex + 1]) {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex + 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex + 1].value\n        ),\n      });\n    } else {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[0].value,\n        optionId: this.getOptionId(this.ungroupedOptions[0].value),\n      });\n    }\n  };\n\n  private setPreviousOptionValue = (selectedOptionIndex: number): void => {\n    if (this.ungroupedOptions[selectedOptionIndex - 1]) {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[selectedOptionIndex - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[selectedOptionIndex - 1].value\n        ),\n      });\n    } else {\n      this.menuOptionSelect.emit({\n        value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        optionId: this.getOptionId(\n          this.ungroupedOptions[this.ungroupedOptions.length - 1].value\n        ),\n      });\n    }\n  };\n\n  /**\n   * @internal If menu is opened with the mouse, emit menuStateChange custom event.\n   */\n  @Method()\n  async handleClickOpen(): Promise<void> {\n    if (!this.preventClickOpen) {\n      this.menuStateChange.emit({ open: !this.open });\n      this.keyboardNav = false;\n    }\n    this.preventClickOpen = false;\n  }\n\n  /**\n   * Used alongside activationType\n   * If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.\n   * @param {KeyboardEvent} event - keyboard event\n   */\n  @Method()\n  async handleKeyboardOpen(event: KeyboardEvent): Promise<void> {\n    this.keyboardNav = false;\n\n    if (this.activationType === \"automatic\") {\n      this.autoSetInputValueKeyboardOpen(event);\n    } else {\n      this.keyboardNav = true;\n      this.manSetInputValueKeyboardOpen(event);\n    }\n  }\n\n  /**\n   * @internal Used to highlight the first option in the menu.\n   */\n  @Method()\n  async handleSetFirstOption(): Promise<void> {\n    this.setHighlightedOption(0);\n  }\n\n  private arrowBehaviour = (event: KeyboardEvent): void => {\n    event.preventDefault();\n    this.handleMenuChange(true);\n  };\n\n  private setHighlightedOption = (highlightedIndex: number): void => {\n    this.optionHighlighted = this.options[highlightedIndex].value || undefined;\n  };\n\n  private autoSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    this.keyboardNav = false;\n\n    const isSearchableSelect = this.inputEl?.tagName === \"INPUT\";\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setNextOptionValue(selectedOptionIndex);\n        break;\n      case \"ArrowUp\":\n        this.keyboardNav = true;\n        this.arrowBehaviour(event);\n        this.setPreviousOptionValue(selectedOptionIndex);\n        break;\n      case \" \":\n      case \"Enter\":\n        if ((event.target as HTMLElement).id !== \"clear-button\") {\n          this.handleMenuChange(true);\n        }\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        break;\n    }\n  };\n\n  private manSetInputValueKeyboardOpen = (event: KeyboardEvent) => {\n    const highlightedOptionIndex = this.options.findIndex(\n      (option) => option.value === this.optionHighlighted\n    );\n\n    const getOptionId = (index: number): string =>\n      Array.from(this.host.querySelectorAll(\"li\"))[index].id;\n\n    switch (event.key) {\n      case \"ArrowDown\":\n        this.arrowBehaviour(event);\n        if (highlightedOptionIndex < this.options.length - 1) {\n          this.setHighlightedOption(highlightedOptionIndex + 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex + 1),\n          });\n        } else {\n          this.setHighlightedOption(0);\n          this.menuOptionId.emit({\n            optionId: getOptionId(0),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"ArrowUp\":\n        this.arrowBehaviour(event);\n        if (\n          highlightedOptionIndex <= 0 ||\n          highlightedOptionIndex > this.options.length + 1\n        ) {\n          this.setHighlightedOption(this.options.length - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(this.options.length - 1),\n          });\n        } else {\n          this.setHighlightedOption(highlightedOptionIndex - 1);\n          this.menuOptionId.emit({\n            optionId: getOptionId(highlightedOptionIndex - 1),\n          });\n        }\n        this.preventIncorrectTabOrder = false;\n        this.focusFromSearchKeypress = false;\n        break;\n      case \"Enter\":\n        event.preventDefault();\n        this.setInputValue(highlightedOptionIndex);\n        break;\n      case \"Escape\":\n        this.handleMenuChange(false);\n        this.menuOptionId.emit({ optionId: undefined });\n        break;\n      case \"Shift\":\n      case \"Tab\":\n        this.preventIncorrectTabOrder = true;\n        break;\n      case \"Backspace\":\n        if (this.isSearchBar) {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n      default:\n        if (this.isSearchBar && event.key !== \"Tab\") {\n          (this.parentEl as HTMLIcSearchBarElement).setFocus();\n          this.focusFromSearchKeypress = true;\n          this.setHighlightedOption(0);\n        }\n        break;\n    }\n  };\n\n  private setInputValue = (highlightedOptionIndex: number) => {\n    if (this.options[highlightedOptionIndex]) {\n      this.menuOptionSelect.emit({\n        value: this.options[highlightedOptionIndex]?.value,\n      });\n      this.optionHighlighted = undefined;\n      this.menuOptionId.emit({ optionId: undefined });\n    }\n    this.handleMenuChange(false);\n  };\n\n  private handleOptionClick = (event: Event): void => {\n    const { value, label } = (event.target as HTMLLIElement).dataset;\n    this.menuOptionSelect.emit({ value, label });\n    this.handleMenuChange(false);\n  };\n\n  private handleBlur = (event: FocusEvent): void => {\n    if (event.relatedTarget !== this.inputEl) {\n      if (!this.menu.contains(event.relatedTarget as HTMLElement)) {\n        this.handleMenuChange(false, false);\n      }\n    } else {\n      this.handleMenuChange(false);\n      this.preventClickOpen = true;\n    }\n  };\n\n  private handleMouseDown = (event: Event): void => {\n    event.preventDefault();\n  };\n\n  private handleMenuKeyDown = (event: KeyboardEvent) => {\n    if (this.activationType === \"automatic\") {\n      this.autoSetValueOnMenuKeyDown(event);\n    }\n  };\n\n  private emitMenuKeyPress = (isNavKey: boolean, key: string) => {\n    this.menuKeyPress.emit({ isNavKey: isNavKey, key: key });\n  };\n\n  private autoSetValueOnMenuKeyDown = (event: KeyboardEvent): void => {\n    event.cancelBubble = true;\n    const selectedOptionIndex = this.ungroupedOptions.findIndex(\n      (option) => option.value === this.value\n    );\n\n    const isSearchableSelect = this.inputEl.tagName === \"INPUT\";\n\n    this.keyboardNav = false;\n\n    switch (event.key) {\n      case \"ArrowUp\":\n        event.preventDefault();\n        this.setPreviousOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"ArrowDown\":\n        event.preventDefault();\n        this.setNextOptionValue(selectedOptionIndex);\n        this.keyboardNav = true;\n        break;\n      case \"Home\":\n        this.menuOptionSelect.emit({\n          value: this.ungroupedOptions[0].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \"End\":\n        this.menuOptionSelect.emit({\n          value: this.ungroupedOptions[this.ungroupedOptions.length - 1].value,\n        });\n        this.keyboardNav = true;\n        break;\n      case \"Enter\":\n      case \"Escape\":\n        this.handleMenuChange(false);\n        break;\n      case \"Backspace\":\n        if (isSearchableSelect) {\n          this.inputEl.focus();\n        }\n        break;\n      case \"Shift\":\n        break;\n      default:\n        if (isSearchableSelect && event.key !== \"Tab\") {\n          this.inputEl.focus();\n        }\n        if (event.key.length === 1) {\n          this.keyboardNav = true;\n        }\n        break;\n    }\n    this.emitMenuKeyPress(this.keyboardNav, event.key);\n  };\n\n  private handleMenuKeyUp = (event: KeyboardEvent): void => {\n    if (event.key === \"Tab\" && event.shiftKey) {\n      this.preventClickOpen = false;\n    }\n  };\n\n  private getOptionId = (value: string): string => {\n    return `${this.menuId}-${value}`;\n  };\n\n  private getOptionAriaLabel = (\n    option: IcMenuOption,\n    parentOption: IcMenuOption\n  ): string => {\n    let ariaLabel = option.label;\n\n    if (option.description) {\n      ariaLabel = `${ariaLabel}, ${option.description}`;\n    }\n\n    if (parentOption) {\n      return `${ariaLabel}, ${parentOption.label} group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  private getSortedOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n    let sorted: IcMenuOption[] = [];\n    if (options.sort) {\n      sorted = options.sort((optionA, optionB) =>\n        optionA.recommended && !optionB.recommended ? -1 : 0\n      );\n    }\n    return sorted;\n  };\n\n  private isManualMode = this.activationType === \"manual\";\n\n  private scrollToSelected = (menu: HTMLUListElement) => {\n    const selectedOption = menu.querySelector(\n      \".option[aria-selected]\"\n    ) as HTMLElement;\n\n    if (selectedOption) {\n      const elTop = selectedOption.offsetTop + selectedOption.offsetHeight;\n      if (\n        elTop > menu.scrollTop + menu.offsetHeight ||\n        elTop < menu.scrollTop + menu.offsetHeight\n      ) {\n        menu.scrollTop = selectedOption.offsetTop;\n      }\n      selectedOption.focus();\n    }\n  };\n\n  private loadUngroupedOptions = () => {\n    if (this.options.length > 0 && this.options.map) {\n      this.options.map((option) => {\n        if (option.children) {\n          option.children.map(\n            (option) => !option.disabled && this.ungroupedOptions.push(option)\n          );\n        } else if (!option.disabled) {\n          this.ungroupedOptions.push(option);\n        }\n      });\n    }\n    this.ungroupedOptions = this.getSortedOptions(this.ungroupedOptions);\n    this.ungroupedOptionsSet.emit({ options: this.ungroupedOptions });\n  };\n\n  private setMenuScrollbar = () => {\n    let optionsHeight = 0;\n    this.host\n      .querySelectorAll(\".option\")\n      .forEach((option) => (optionsHeight += option.clientHeight));\n\n    if (optionsHeight >= 320) {\n      this.menu.classList.add(\"menu-scroll\");\n    }\n  };\n\n  connectedCallback(): void {\n    if (this.parentEl?.tagName === \"IC-SEARCH-BAR\") {\n      this.setHighlightedOption(0);\n      this.initialOptionsListRender = true;\n    }\n  }\n\n  componentWillLoad(): void {\n    this.loadUngroupedOptions();\n    this.isSearchBar = this.parentEl.tagName === \"IC-SEARCH-BAR\";\n    this.parentEl.addEventListener(\"icClear\", this.handleClearListener);\n    this.parentEl.addEventListener(\"icSubmitSearch\", this.handleSubmitSearch);\n  }\n\n  componentDidLoad(): void {\n    if (\n      this.isSearchBar &&\n      (this.parentEl as HTMLIcSearchBarElement).disableFilter\n    ) {\n      this.focusFromSearchKeypress = true;\n    }\n\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.open, propName: \"open\" },\n        { prop: this.options, propName: \"options\" },\n        { prop: this.menuId, propName: \"menu-id\" },\n        { prop: this.inputLabel, propName: \"input-label\" },\n        //NOTE: no check for value, input-el or anchor-el as otherwise get console errors on first load of select component\n      ],\n      \"Menu\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.open) {\n      this.popperInstance = createPopper(this.anchorEl, this.host, {\n        placement: \"bottom\",\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 7],\n            },\n          },\n          {\n            name: \"flip\",\n            options: {\n              fallbackPlacements: [\"top\"],\n              rootBoundary: \"viewport\",\n            },\n          },\n        ],\n      });\n    }\n\n    if (this.open && !!this.options.length) {\n      this.setMenuScrollbar();\n    }\n  }\n\n  componentDidUpdate(): void {\n    const inputValueInOptions: boolean = this.options.some(\n      (option) => option.value === this.value\n    );\n\n    const optionHighlightedIsSet =\n      this.optionHighlighted !== null &&\n      this.optionHighlighted !== undefined &&\n      this.optionHighlighted !== \"\";\n\n    if (this.open && this.options.length !== 0) {\n      if (\n        this.value &&\n        this.keyboardNav &&\n        inputValueInOptions &&\n        this.autoFocusOnSelected\n      ) {\n        this.scrollToSelected(this.menu);\n      } else if (\n        this.inputEl.tagName !== \"IC-TEXT-FIELD\" &&\n        this.inputEl.tagName !== \"INPUT\"\n      ) {\n        this.menu.focus();\n      } else if (\n        optionHighlightedIsSet &&\n        !this.focusFromSearchKeypress &&\n        !this.preventIncorrectTabOrder\n      ) {\n        const highlightedEl = this.host.querySelector(\n          `li[data-value=\"${this.optionHighlighted}\"]`\n        ) as HTMLElement;\n\n        if (highlightedEl) {\n          highlightedEl.focus();\n        }\n      }\n    }\n  }\n\n  disconnectedCallback(): void {\n    this.parentEl.removeEventListener(\"icClear\", this.handleClearListener);\n    this.parentEl.removeEventListener(\n      \"icSubmitSearch\",\n      this.handleSubmitSearch\n    );\n  }\n\n  private displayOption = (\n    option: IcMenuOption,\n    index?: number,\n    parentOption?: IcMenuOption\n  ): HTMLLIElement => {\n    const { open, value } = this;\n\n    return (\n      <li\n        id={this.getOptionId(option.value)}\n        class={{\n          option: true,\n          \"focused-option\": this.isManualMode\n            ? (this.keyboardNav || this.initialOptionsListRender) &&\n              option.value === this.optionHighlighted\n            : this.keyboardNav && option.value === value,\n          \"last-recommended-option\":\n            option.recommended &&\n            this.options[index + 1] &&\n            !this.options[index + 1].recommended,\n          \"disabled-option\": option.disabled,\n        }}\n        role=\"option\"\n        tabindex={\n          open &&\n          (option.value === value || option.value === this.optionHighlighted) &&\n          this.keyboardNav\n            ? \"0\"\n            : \"-1\"\n        }\n        aria-label={this.getOptionAriaLabel(option, parentOption)}\n        aria-selected={option.value === value}\n        aria-disabled={option.disabled ? \"true\" : \"false\"}\n        onClick={this.handleOptionClick}\n        onBlur={this.handleBlur}\n        onMouseDown={this.handleMouseDown}\n        data-value={option.value}\n        data-label={option.label}\n      >\n        <div class=\"option-text-container\">\n          <ic-typography variant=\"body\" aria-hidden=\"true\">\n            <p>{option.label}</p>\n          </ic-typography>\n          {option.description && (\n            <ic-typography\n              id={`${this.getOptionId(option.value)}-description`}\n              class=\"option-description\"\n              variant=\"caption\"\n              aria-hidden=\"true\"\n            >\n              <p>{option.description}</p>\n            </ic-typography>\n          )}\n        </div>\n        {option?.value.toLowerCase() === value?.toLowerCase() &&\n          this.parentEl.tagName !== \"IC-SEARCH-BAR\" && (\n            <span class=\"check-icon\" innerHTML={Check} />\n          )}\n      </li>\n    );\n  };\n\n  render() {\n    const { inputLabel, options, menuId, value, fullWidth } = this;\n\n    return (\n      <Host\n        class={{\n          \"full-width\": fullWidth,\n          \"no-focus\": this.inputEl?.tagName === \"INPUT\",\n        }}\n      >\n        {options.length !== 0 && (\n          <ul\n            id={menuId}\n            class=\"menu\"\n            role=\"listbox\"\n            aria-label={inputLabel}\n            aria-activedescendant={\n              value != null && value !== \"\" ? this.getOptionId(value) : \"\"\n            }\n            tabindex={\n              open && !this.keyboardNav && this.inputEl?.tagName !== \"INPUT\"\n                ? \"0\"\n                : \"-1\"\n            }\n            ref={(el) => (this.menu = el)}\n            onKeyDown={this.handleMenuKeyDown}\n            onKeyUp={this.handleMenuKeyUp}\n            onBlur={this.handleBlur}\n          >\n            {this.getSortedOptions(options).map((option, index) => {\n              if (option.children) {\n                if (option.children.length > 0) {\n                  return (\n                    <div>\n                      <ic-typography\n                        class=\"option-group-title\"\n                        role=\"presentation\"\n                        variant=\"subtitle-small\"\n                      >\n                        <p>{option.label}</p>\n                      </ic-typography>\n                      {option.children.map((childOption) =>\n                        this.displayOption(childOption, index, option)\n                      )}\n                    </div>\n                  );\n                } else {\n                  return null;\n                }\n              } else {\n                return this.displayOption(option, index);\n              }\n            })}\n          </ul>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/ic-navigation-menu2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { t as getSlotContent, F as getSlot, i as isSlotUsed } from './helpers.js';
+import { u as getSlotContent, G as getSlot, i as isSlotUsed } from './helpers.js';
 import { d as defineCustomElement$4 } from './ic-button2.js';
 import { d as defineCustomElement$3 } from './ic-loading-indicator2.js';
 import { d as defineCustomElement$2 } from './ic-tooltip2.js';

package/dist/components/ic-popover-menu.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface IcPopoverMenu extends Components.IcPopoverMenu, HTMLElement {}
+export const IcPopoverMenu: {
+  prototype: IcPopoverMenu;
+  new (): IcPopoverMenu;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;