@ukic/canary-web-components 2.0.0-canary.9 → 3.0.0-canary.2

package/dist/esm/ic-menu-with-multi.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, g as getElement } from './index-93509377.js';
-import { u as isMacDevice, o as onComponentRequiredPropUndefined, e as getOptionsWithoutGroupTitlesCount } from './helpers-f328a7b6.js';
+import { E as isMacDevice, o as onComponentRequiredPropUndefined, m as getOptionsWithoutGroupTitlesCount } from './helpers-5bd2012a.js';
 
 var top = 'top';
 var bottom = 'bottom';
@@ -1797,7 +1797,7 @@ const Check = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/200
 </svg>
 `;
 
-const icMenuCss = "html.sc-ic-menu-with-multi{line-height:1.15;-webkit-text-size-adjust:100%}body.sc-ic-menu-with-multi{margin:0}main.sc-ic-menu-with-multi{display:block}h1.sc-ic-menu-with-multi{font-size:2em;margin:0.67em 0}hr.sc-ic-menu-with-multi{box-sizing:content-box;height:0;overflow:visible}pre.sc-ic-menu-with-multi{font-family:monospace, monospace;font-size:1em}a.sc-ic-menu-with-multi{background-color:transparent}abbr[title].sc-ic-menu-with-multi{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b.sc-ic-menu-with-multi,strong.sc-ic-menu-with-multi{font-weight:bolder}code.sc-ic-menu-with-multi,kbd.sc-ic-menu-with-multi,samp.sc-ic-menu-with-multi{font-family:monospace, monospace;font-size:1em}small.sc-ic-menu-with-multi{font-size:80%}sub.sc-ic-menu-with-multi,sup.sc-ic-menu-with-multi{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub.sc-ic-menu-with-multi{bottom:-0.25em}sup.sc-ic-menu-with-multi{top:-0.5em}img.sc-ic-menu-with-multi{border-style:none}button.sc-ic-menu-with-multi,input.sc-ic-menu-with-multi,optgroup.sc-ic-menu-with-multi,select.sc-ic-menu-with-multi,textarea.sc-ic-menu-with-multi{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button.sc-ic-menu-with-multi,input.sc-ic-menu-with-multi{overflow:visible}button.sc-ic-menu-with-multi,select.sc-ic-menu-with-multi{text-transform:none}button.sc-ic-menu-with-multi,[type=\"button\"].sc-ic-menu-with-multi,[type=\"reset\"].sc-ic-menu-with-multi,[type=\"submit\"].sc-ic-menu-with-multi{-webkit-appearance:button}button.sc-ic-menu-with-multi::-moz-focus-inner,[type=\"button\"].sc-ic-menu-with-multi::-moz-focus-inner,[type=\"reset\"].sc-ic-menu-with-multi::-moz-focus-inner,[type=\"submit\"].sc-ic-menu-with-multi::-moz-focus-inner{border-style:none;padding:0}button.sc-ic-menu-with-multi:-moz-focusring,[type=\"button\"].sc-ic-menu-with-multi:-moz-focusring,[type=\"reset\"].sc-ic-menu-with-multi:-moz-focusring,[type=\"submit\"].sc-ic-menu-with-multi:-moz-focusring{outline:1px dotted ButtonText}fieldset.sc-ic-menu-with-multi{padding:0.35em 0.75em 0.625em}legend.sc-ic-menu-with-multi{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress.sc-ic-menu-with-multi{vertical-align:baseline}textarea.sc-ic-menu-with-multi{overflow:auto}[type=\"checkbox\"].sc-ic-menu-with-multi,[type=\"radio\"].sc-ic-menu-with-multi{box-sizing:border-box;padding:0}[type=\"number\"].sc-ic-menu-with-multi::-webkit-inner-spin-button,[type=\"number\"].sc-ic-menu-with-multi::-webkit-outer-spin-button{height:auto}[type=\"search\"].sc-ic-menu-with-multi{-webkit-appearance:textfield;outline-offset:-2px}[type=\"search\"].sc-ic-menu-with-multi::-webkit-search-decoration{-webkit-appearance:none}.sc-ic-menu-with-multi::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details.sc-ic-menu-with-multi{display:block}summary.sc-ic-menu-with-multi{display:list-item}template.sc-ic-menu-with-multi{display:none}[hidden].sc-ic-menu-with-multi{display:none}html.sc-ic-menu-with-multi,body.sc-ic-menu-with-multi,div.sc-ic-menu-with-multi,span.sc-ic-menu-with-multi,applet.sc-ic-menu-with-multi,object.sc-ic-menu-with-multi,iframe.sc-ic-menu-with-multi,h1.sc-ic-menu-with-multi,h2.sc-ic-menu-with-multi,h3.sc-ic-menu-with-multi,h4.sc-ic-menu-with-multi,h5.sc-ic-menu-with-multi,h6.sc-ic-menu-with-multi,p.sc-ic-menu-with-multi,blockquote.sc-ic-menu-with-multi,pre.sc-ic-menu-with-multi,a.sc-ic-menu-with-multi,abbr.sc-ic-menu-with-multi,acronym.sc-ic-menu-with-multi,address.sc-ic-menu-with-multi,big.sc-ic-menu-with-multi,cite.sc-ic-menu-with-multi,code.sc-ic-menu-with-multi,del.sc-ic-menu-with-multi,dfn.sc-ic-menu-with-multi,em.sc-ic-menu-with-multi,img.sc-ic-menu-with-multi,ins.sc-ic-menu-with-multi,kbd.sc-ic-menu-with-multi,q.sc-ic-menu-with-multi,s.sc-ic-menu-with-multi,samp.sc-ic-menu-with-multi,small.sc-ic-menu-with-multi,strike.sc-ic-menu-with-multi,strong.sc-ic-menu-with-multi,sub.sc-ic-menu-with-multi,sup.sc-ic-menu-with-multi,tt.sc-ic-menu-with-multi,var.sc-ic-menu-with-multi,b.sc-ic-menu-with-multi,u.sc-ic-menu-with-multi,i.sc-ic-menu-with-multi,center.sc-ic-menu-with-multi,dl.sc-ic-menu-with-multi,dt.sc-ic-menu-with-multi,dd.sc-ic-menu-with-multi,ol.sc-ic-menu-with-multi,ul.sc-ic-menu-with-multi,li.sc-ic-menu-with-multi,fieldset.sc-ic-menu-with-multi,form.sc-ic-menu-with-multi,label.sc-ic-menu-with-multi,legend.sc-ic-menu-with-multi,table.sc-ic-menu-with-multi,caption.sc-ic-menu-with-multi,tbody.sc-ic-menu-with-multi,tfoot.sc-ic-menu-with-multi,thead.sc-ic-menu-with-multi,tr.sc-ic-menu-with-multi,th.sc-ic-menu-with-multi,td.sc-ic-menu-with-multi,article.sc-ic-menu-with-multi,aside.sc-ic-menu-with-multi,canvas.sc-ic-menu-with-multi,details.sc-ic-menu-with-multi,embed.sc-ic-menu-with-multi,figure.sc-ic-menu-with-multi,figcaption.sc-ic-menu-with-multi,footer.sc-ic-menu-with-multi,header.sc-ic-menu-with-multi,hgroup.sc-ic-menu-with-multi,menu.sc-ic-menu-with-multi,nav.sc-ic-menu-with-multi,output.sc-ic-menu-with-multi,ruby.sc-ic-menu-with-multi,section.sc-ic-menu-with-multi,summary.sc-ic-menu-with-multi,time.sc-ic-menu-with-multi,mark.sc-ic-menu-with-multi,audio.sc-ic-menu-with-multi,video.sc-ic-menu-with-multi{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-with-multi-h .menu.sc-ic-menu-with-multi{transition:max-height var(--ic-transition-duration-slow)}}.sc-ic-menu-with-multi-h{max-height:0;width:var(--menu-width, var(--input-width, 20rem));min-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);border-radius:var(--ic-border-radius)}.open.sc-ic-menu-with-multi-h:not(.no-focus):focus-within{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}.select-all-focused.sc-ic-menu-with-multi-h{box-shadow:var(--ic-elevation-overlay) !important}#retry-button.sc-ic-menu-with-multi::part(button){height:var(--ic-space-lg)}.small.sc-ic-menu-with-multi #retry-button.sc-ic-menu-with-multi::part(button){height:var(--ic-space-md)}.on-dialog.sc-ic-menu-with-multi-h{inset:auto !important}.menu.sc-ic-menu-with-multi{text-decoration:none;list-style-type:none;border-radius:1px;background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu.sc-ic-menu-with-multi:has(+.option-bar).sc-ic-menu-with-multi{border-radius:0 0 1px 1px}.menu-scroll.sc-ic-menu-with-multi{overflow-y:auto}.menu.sc-ic-menu-with-multi:focus-visible{outline:none}.open.sc-ic-menu-with-multi-h{max-height:none;display:flex;flex-direction:column-reverse;border:var(--ic-border-width) solid var(--ic-architectural-400);transition:box-shadow var(--ic-easing-transition-fast)}.open.sc-ic-menu-with-multi-h .menu.sc-ic-menu-with-multi{visibility:visible;max-height:calc(var(--ic-space-xl) * 10 + var(--ic-space-xxxs))}.open.sc-ic-menu-with-multi-h .option-bar.sc-ic-menu-with-multi{visibility:visible}.open.sc-ic-menu-with-multi-h .select-all-button.sc-ic-menu-with-multi{display:block}.full-width.sc-ic-menu-with-multi-h{width:100%}.option.sc-ic-menu-with-multi{padding:var(--ic-space-xs) calc(var(--ic-space-xs) - var(--ic-space-1px));cursor:pointer;display:flex;align-items:center}.loading-option.sc-ic-menu-with-multi p.sc-ic-menu-with-multi{margin-bottom:0 !important}.option.sc-ic-menu-with-multi:not(.loading-option){justify-content:space-between}.small.sc-ic-menu-with-multi-h .option.sc-ic-menu-with-multi{padding:var(--ic-space-xxs) calc(var(--ic-space-xs) - var(--ic-space-1px))}.large.sc-ic-menu-with-multi-h .option.sc-ic-menu-with-multi{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))}.option.sc-ic-menu-with-multi:last-child{border-radius:0 0 1px 1px}.sc-ic-menu-with-multi:not(.menu:has(+.option-bar)).sc-ic-menu-with-multi .option.sc-ic-menu-with-multi:first-child{border-radius:1px 1px 0 0}.option.sc-ic-menu-with-multi:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option.sc-ic-menu-with-multi:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-active)}.option.sc-ic-menu-with-multi:focus-visible{outline:var(--ic-hc-focus-outline)}.option.sc-ic-menu-with-multi:not(.disabled-option) .option-description.sc-ic-menu-with-multi{color:var(--ic-color-secondary-text)}.option.sc-ic-menu-with-multi .option-label.sc-ic-menu-with-multi{display:flex;flex-direction:row;align-items:top}.option.sc-ic-menu-with-multi .option-element.sc-ic-menu-with-multi{margin-top:var(--ic-space-xxs)}.option.sc-ic-menu-with-multi .option-icon.sc-ic-menu-with-multi{height:var(--ic-space-md);width:var(--ic-space-md);margin-top:var(--ic-space-xxs);margin-right:var(--ic-space-xxxs)}.option-text-container.sc-ic-menu-with-multi{pointer-events:none;max-width:calc(var(--ic-space-lg) * 10 + var(--ic-space-xl))}.option.loading-option.sc-ic-menu-with-multi .option-text-container.sc-ic-menu-with-multi{margin-left:calc(var(--ic-space-xs) + var(--ic-space-xxxs));color:var(--ic-color-secondary-text)}.error-icon-svg.sc-ic-menu-with-multi{height:var(--ic-space-md);width:var(--ic-space-md);fill:var(--ic-status-error);align-self:center;display:flex;margin-right:calc(var(--ic-space-xxs) * 1.2)}.loading-error-info.sc-ic-menu-with-multi{display:flex}.check-icon.sc-ic-menu-with-multi{height:var(--ic-space-lg);min-width:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-xs);pointer-events:none}.focused-option.sc-ic-menu-with-multi .check-icon.sc-ic-menu-with-multi *.sc-ic-menu-with-multi{fill:currentcolor}.option-group-title.sc-ic-menu-with-multi{padding:var(--ic-space-lg) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xs);color:var(--ic-color-tertiary-text)}.small.sc-ic-menu-with-multi-h .option-group-title.sc-ic-menu-with-multi{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xxs)}.last-recommended-option.sc-ic-menu-with-multi{border-bottom:var(--ic-border-default)}.disabled-option.sc-ic-menu-with-multi{color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option.sc-ic-menu-with-multi,.focused-option.sc-ic-menu-with-multi .option-description.sc-ic-menu-with-multi{background-color:var(--ic-focus-blue) !important;color:var(--ic-color-white-text) !important}.no-results.sc-ic-menu-with-multi-h li.sc-ic-menu-with-multi{cursor:no-drop}.no-results.sc-ic-menu-with-multi-h li.sc-ic-menu-with-multi:hover{background-color:transparent}.option-bar.sc-ic-menu-with-multi{padding:var(--ic-space-xxs) var(--ic-space-xs);display:flex;align-items:center;justify-content:space-between;background-color:var(--ic-architectural-40);visibility:hidden;border-bottom:var(--ic-border-width) solid var(--ic-architectural-400);border-radius:1px 1px 0 0}.option-bar.sc-ic-menu-with-multi p.sc-ic-menu-with-multi{margin-bottom:0 !important}.large.sc-ic-menu-with-multi-h .option-bar.sc-ic-menu-with-multi{padding:var(--ic-space-xs)}.select-all-button.sc-ic-menu-with-multi{display:none}.select-all-button.sc-ic-menu-with-multi:focus{z-index:calc(var(--ic-z-index-menu) + 1)}@media (forced-colors: active){.focused-option.sc-ic-menu-with-multi:focus{outline:none;border:0.125rem solid transparent}}";
+const icMenuCss = "html.sc-ic-menu-with-multi{line-height:1.15;-webkit-text-size-adjust:100%}body.sc-ic-menu-with-multi{margin:0}main.sc-ic-menu-with-multi{display:block}h1.sc-ic-menu-with-multi{font-size:2em;margin:0.67em 0}hr.sc-ic-menu-with-multi{box-sizing:content-box;height:0;overflow:visible}pre.sc-ic-menu-with-multi{font-family:monospace, monospace;font-size:1em}a.sc-ic-menu-with-multi{background-color:transparent}abbr[title].sc-ic-menu-with-multi{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b.sc-ic-menu-with-multi,strong.sc-ic-menu-with-multi{font-weight:bolder}code.sc-ic-menu-with-multi,kbd.sc-ic-menu-with-multi,samp.sc-ic-menu-with-multi{font-family:monospace, monospace;font-size:1em}small.sc-ic-menu-with-multi{font-size:80%}sub.sc-ic-menu-with-multi,sup.sc-ic-menu-with-multi{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub.sc-ic-menu-with-multi{bottom:-0.25em}sup.sc-ic-menu-with-multi{top:-0.5em}img.sc-ic-menu-with-multi{border-style:none}button.sc-ic-menu-with-multi,input.sc-ic-menu-with-multi,optgroup.sc-ic-menu-with-multi,select.sc-ic-menu-with-multi,textarea.sc-ic-menu-with-multi{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button.sc-ic-menu-with-multi,input.sc-ic-menu-with-multi{overflow:visible}button.sc-ic-menu-with-multi,select.sc-ic-menu-with-multi{text-transform:none}button.sc-ic-menu-with-multi,[type=\"button\"].sc-ic-menu-with-multi,[type=\"reset\"].sc-ic-menu-with-multi,[type=\"submit\"].sc-ic-menu-with-multi{-webkit-appearance:button}button.sc-ic-menu-with-multi::-moz-focus-inner,[type=\"button\"].sc-ic-menu-with-multi::-moz-focus-inner,[type=\"reset\"].sc-ic-menu-with-multi::-moz-focus-inner,[type=\"submit\"].sc-ic-menu-with-multi::-moz-focus-inner{border-style:none;padding:0}button.sc-ic-menu-with-multi:-moz-focusring,[type=\"button\"].sc-ic-menu-with-multi:-moz-focusring,[type=\"reset\"].sc-ic-menu-with-multi:-moz-focusring,[type=\"submit\"].sc-ic-menu-with-multi:-moz-focusring{outline:1px dotted ButtonText}fieldset.sc-ic-menu-with-multi{padding:0.35em 0.75em 0.625em}legend.sc-ic-menu-with-multi{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress.sc-ic-menu-with-multi{vertical-align:baseline}textarea.sc-ic-menu-with-multi{overflow:auto}[type=\"checkbox\"].sc-ic-menu-with-multi,[type=\"radio\"].sc-ic-menu-with-multi{box-sizing:border-box;padding:0}[type=\"number\"].sc-ic-menu-with-multi::-webkit-inner-spin-button,[type=\"number\"].sc-ic-menu-with-multi::-webkit-outer-spin-button{height:auto}[type=\"search\"].sc-ic-menu-with-multi{-webkit-appearance:textfield;outline-offset:-2px}[type=\"search\"].sc-ic-menu-with-multi::-webkit-search-decoration{-webkit-appearance:none}.sc-ic-menu-with-multi::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details.sc-ic-menu-with-multi{display:block}summary.sc-ic-menu-with-multi{display:list-item}template.sc-ic-menu-with-multi{display:none}[hidden].sc-ic-menu-with-multi{display:none}html.sc-ic-menu-with-multi,body.sc-ic-menu-with-multi,div.sc-ic-menu-with-multi,span.sc-ic-menu-with-multi,applet.sc-ic-menu-with-multi,object.sc-ic-menu-with-multi,iframe.sc-ic-menu-with-multi,h1.sc-ic-menu-with-multi,h2.sc-ic-menu-with-multi,h3.sc-ic-menu-with-multi,h4.sc-ic-menu-with-multi,h5.sc-ic-menu-with-multi,h6.sc-ic-menu-with-multi,p.sc-ic-menu-with-multi,blockquote.sc-ic-menu-with-multi,pre.sc-ic-menu-with-multi,a.sc-ic-menu-with-multi,abbr.sc-ic-menu-with-multi,acronym.sc-ic-menu-with-multi,address.sc-ic-menu-with-multi,big.sc-ic-menu-with-multi,cite.sc-ic-menu-with-multi,code.sc-ic-menu-with-multi,del.sc-ic-menu-with-multi,dfn.sc-ic-menu-with-multi,em.sc-ic-menu-with-multi,img.sc-ic-menu-with-multi,ins.sc-ic-menu-with-multi,kbd.sc-ic-menu-with-multi,q.sc-ic-menu-with-multi,s.sc-ic-menu-with-multi,samp.sc-ic-menu-with-multi,small.sc-ic-menu-with-multi,strike.sc-ic-menu-with-multi,strong.sc-ic-menu-with-multi,sub.sc-ic-menu-with-multi,sup.sc-ic-menu-with-multi,tt.sc-ic-menu-with-multi,var.sc-ic-menu-with-multi,b.sc-ic-menu-with-multi,u.sc-ic-menu-with-multi,i.sc-ic-menu-with-multi,center.sc-ic-menu-with-multi,dl.sc-ic-menu-with-multi,dt.sc-ic-menu-with-multi,dd.sc-ic-menu-with-multi,ol.sc-ic-menu-with-multi,ul.sc-ic-menu-with-multi,li.sc-ic-menu-with-multi,fieldset.sc-ic-menu-with-multi,form.sc-ic-menu-with-multi,label.sc-ic-menu-with-multi,legend.sc-ic-menu-with-multi,table.sc-ic-menu-with-multi,caption.sc-ic-menu-with-multi,tbody.sc-ic-menu-with-multi,tfoot.sc-ic-menu-with-multi,thead.sc-ic-menu-with-multi,tr.sc-ic-menu-with-multi,th.sc-ic-menu-with-multi,td.sc-ic-menu-with-multi,article.sc-ic-menu-with-multi,aside.sc-ic-menu-with-multi,canvas.sc-ic-menu-with-multi,details.sc-ic-menu-with-multi,embed.sc-ic-menu-with-multi,figure.sc-ic-menu-with-multi,figcaption.sc-ic-menu-with-multi,footer.sc-ic-menu-with-multi,header.sc-ic-menu-with-multi,hgroup.sc-ic-menu-with-multi,menu.sc-ic-menu-with-multi,nav.sc-ic-menu-with-multi,output.sc-ic-menu-with-multi,ruby.sc-ic-menu-with-multi,section.sc-ic-menu-with-multi,summary.sc-ic-menu-with-multi,time.sc-ic-menu-with-multi,mark.sc-ic-menu-with-multi,audio.sc-ic-menu-with-multi,video.sc-ic-menu-with-multi{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){.ic-menu-open.sc-ic-menu-with-multi-h .menu.sc-ic-menu-with-multi{transition:max-height var(--ic-transition-duration-slow)}}.sc-ic-menu-with-multi-h{max-height:0;width:var(--menu-width, var(--input-width, 20rem));min-width:20rem;color:var(--ic-color-text-primary);--ic-typography-color:var(--ic-color-text-primary);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);border-radius:var(--ic-border-radius)}.ic-menu-open.sc-ic-menu-with-multi-h:not(.ic-menu-no-focus):focus-within{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}.select-all-focused.sc-ic-menu-with-multi-h{box-shadow:var(--ic-elevation-overlay) !important}#retry-button.sc-ic-menu-with-multi::part(button){height:var(--ic-space-lg)}.small.sc-ic-menu-with-multi #retry-button.sc-ic-menu-with-multi::part(button){height:var(--ic-space-md)}.on-dialog.sc-ic-menu-with-multi-h{inset:auto !important}.menu.sc-ic-menu-with-multi{text-decoration:none;list-style-type:none;border-radius:1px;background-color:var(--ic-architectural-white);visibility:hidden;max-height:0;overflow-y:hidden}.menu.sc-ic-menu-with-multi:has(+.option-bar).sc-ic-menu-with-multi{border-radius:0 0 1px 1px}.menu-scroll.sc-ic-menu-with-multi{overflow-y:auto}.menu.sc-ic-menu-with-multi:focus-visible{outline:none}.ic-menu-open.sc-ic-menu-with-multi-h{max-height:none;display:flex;flex-direction:column-reverse;border:var(--ic-border-width) solid var(--ic-architectural-400);transition:box-shadow var(--ic-easing-transition-fast)}.ic-menu-open.sc-ic-menu-with-multi-h .menu.sc-ic-menu-with-multi{visibility:visible;max-height:calc(var(--ic-space-xl) * 10 + var(--ic-space-xxxs))}.ic-menu-open.sc-ic-menu-with-multi-h .option-bar.sc-ic-menu-with-multi{visibility:visible}.ic-menu-open.sc-ic-menu-with-multi-h .select-all-button.sc-ic-menu-with-multi{display:block}.ic-menu-full-width.sc-ic-menu-with-multi-h{width:100%}.option.sc-ic-menu-with-multi{padding:var(--ic-space-xs) calc(var(--ic-space-xs) - var(--ic-space-1px));cursor:pointer;display:flex;align-items:center}.loading-option.sc-ic-menu-with-multi p.sc-ic-menu-with-multi{margin-bottom:0 !important}.option.sc-ic-menu-with-multi:not(.loading-option){justify-content:space-between}.ic-menu-small.sc-ic-menu-with-multi-h .option.sc-ic-menu-with-multi{padding:var(--ic-space-xxs) calc(var(--ic-space-xs) - var(--ic-space-1px))}.ic-menu-large.sc-ic-menu-with-multi-h .option.sc-ic-menu-with-multi{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))}.option.sc-ic-menu-with-multi:last-child{border-radius:0 0 1px 1px}.sc-ic-menu-with-multi:not(.menu:has(+.option-bar)).sc-ic-menu-with-multi .option.sc-ic-menu-with-multi:first-child{border-radius:1px 1px 0 0}.option.sc-ic-menu-with-multi:not(.disabled-option):hover{background-color:var(--ic-action-dark-bg-hover)}.option.sc-ic-menu-with-multi:not(.disabled-option):active{background-color:var(--ic-action-dark-bg-pressed)}.option.sc-ic-menu-with-multi:focus-visible{outline:var(--ic-hc-focus-outline)}.option.sc-ic-menu-with-multi:not(.disabled-option) .option-description.sc-ic-menu-with-multi{--ic-typography-color:var(--ic-color-text-secondary)}.option.sc-ic-menu-with-multi .option-label.sc-ic-menu-with-multi{display:flex;flex-direction:row;align-items:top}.option.sc-ic-menu-with-multi .option-element.sc-ic-menu-with-multi{margin-top:var(--ic-space-xxs)}.option.sc-ic-menu-with-multi .option-icon.sc-ic-menu-with-multi{height:var(--ic-space-md);width:var(--ic-space-md);margin-top:var(--ic-space-xxs);margin-right:var(--ic-space-xxxs)}.option-text-container.sc-ic-menu-with-multi{pointer-events:none;max-width:calc(var(--ic-space-lg) * 10 + var(--ic-space-xl))}.option.loading-option.sc-ic-menu-with-multi .option-text-container.sc-ic-menu-with-multi{margin-left:calc(var(--ic-space-xs) + var(--ic-space-xxxs));color:var(--ic-color-text-secondary);--ic-typography-color:var(--ic-color-text-secondary)}.error-icon-svg.sc-ic-menu-with-multi{height:var(--ic-space-md);width:var(--ic-space-md);fill:var(--ic-status-error-default);align-self:center;display:flex;margin-right:calc(var(--ic-space-xxs) * 1.2)}.loading-error-info.sc-ic-menu-with-multi{display:flex}.check-icon.sc-ic-menu-with-multi{height:var(--ic-space-lg);min-width:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-xs);pointer-events:none}.focused-option.sc-ic-menu-with-multi .check-icon.sc-ic-menu-with-multi *.sc-ic-menu-with-multi{fill:currentcolor}.option-group-title.sc-ic-menu-with-multi{padding:var(--ic-space-lg) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xs);--ic-typography-color:var(--ic-color-text-tertiary)}.ic-menu-small.sc-ic-menu-with-multi-h .option-group-title.sc-ic-menu-with-multi{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))\n    var(--ic-space-xxs)}.last-recommended-option.sc-ic-menu-with-multi{border-bottom:var(--ic-border-default)}.disabled-option.sc-ic-menu-with-multi{color:var(--ic-architectural-200);--ic-typography-color:var(--ic-architectural-200);cursor:default;pointer-events:none}.focused-option.sc-ic-menu-with-multi,.focused-option.sc-ic-menu-with-multi .option-description.sc-ic-menu-with-multi{background-color:var(--ic-color-focus-inner) !important;color:var(--ic-architectural-white) !important;--ic-typography-color:var(--ic-architectural-white) !important}.no-results.sc-ic-menu-with-multi-h li.sc-ic-menu-with-multi{cursor:no-drop}.no-results.sc-ic-menu-with-multi-h li.sc-ic-menu-with-multi:hover{background-color:transparent}.option-bar.sc-ic-menu-with-multi{padding:var(--ic-space-xxs) var(--ic-space-xs);display:flex;align-items:center;justify-content:space-between;background-color:var(--ic-architectural-40);visibility:hidden;border-bottom:var(--ic-border-width) solid var(--ic-architectural-400);border-radius:1px 1px 0 0}.option-bar.sc-ic-menu-with-multi p.sc-ic-menu-with-multi{margin-bottom:0 !important}.ic-menu-large.sc-ic-menu-with-multi-h .option-bar.sc-ic-menu-with-multi{padding:var(--ic-space-xs)}.select-all-button.sc-ic-menu-with-multi{display:none}.select-all-button.sc-ic-menu-with-multi:focus{z-index:calc(var(--ic-z-index-menu) + 1)}@media (forced-colors: active){.focused-option.sc-ic-menu-with-multi:focus{outline:none;border:0.125rem solid transparent}}";
 
 const Menu = class {
     constructor(hostRef) {
@@ -1819,9 +1819,12 @@ const Menu = class {
         this.isMultiSelect = false;
         this.isSearchBar = false;
         this.isSearchableSelect = false;
+        this.lastOptionSelected = null; // Index of last option selected
+        this.lastOptionFocused = null; // Index of last option focused
         this.multiOptionClicked = null;
         this.preventClickOpen = false; // Prevents menu re-opening immediately after it is closed on blur when clicking input.
         this.preventMenuFocus = false; // (When multiple) ensures focus moves straight to select all button from menu.
+        this.shiftPressed = false;
         this.ungroupedOptions = [];
         this.handleClearListener = () => {
             this.optionHighlighted = "";
@@ -1941,7 +1944,6 @@ const Menu = class {
                         }
                         else {
                             this.setInputValue(highlightedOptionIndex);
-                            this.value = options[highlightedOptionIndex][this.valueField];
                         }
                     }
                 }
@@ -1954,16 +1956,38 @@ const Menu = class {
                 this.handleMenuChange(true);
             }
         };
+        // Check if option is selected based on the index of the option
+        this.isOptionSelected = (index) => {
+            const menuOptions = this.getMenuOptions();
+            return this.value
+                ? this.value.includes(menuOptions[index][this.valueField])
+                : false;
+        };
+        // Deselect currently selected options when shift pressed, but keep certain options selected
+        this.deselectSelectedOptions = (optionsToKeepSelected) => {
+            const menuOptions = this.getMenuOptions();
+            if (this.value) {
+                const selectedOptionIndexes = this.value.map((value) => {
+                    return menuOptions.findIndex((option) => option[this.valueField] === value);
+                });
+                // Call setInputValue (which toggles the selected state) on options that need to be deselected
+                selectedOptionIndexes.forEach((index) => !optionsToKeepSelected.includes(index) && this.setInputValue(index));
+            }
+        };
         // Determines keyboard behaviour when selection is manual (i.e. when you have to press Enter to select an option)
         this.manualSetInputValueKeyboardOpen = (event) => {
             const menuOptions = this.getMenuOptions();
-            this.keyboardNav = false;
-            const highlightedOptionIndex = menuOptions.findIndex((option) => option[this.valueField] === this.optionHighlighted);
+            // Prevent focus disappearing on currently focused option when Shift / Cmd / Ctrl pressed
+            // (i.e. when user is likely in the middle of executing a keyboard combination to select options)
+            if (!(event.shiftKey || event.metaKey || event.ctrlKey)) {
+                this.keyboardNav = false;
+            }
+            const highlightedOptionIndex = this.getOptionHighlightedIndex();
             const clickedMultiOptionIndex = menuOptions.findIndex((option) => option[this.valueField] === this.multiOptionClicked);
             const getOptionId = (index) => { var _a; return (_a = Array.from(this.el.querySelectorAll("li"))[index]) === null || _a === void 0 ? void 0 : _a.id; };
             // Space press should be equivalent to Enter when multi-select
             if (event.key === " " && this.isMultiSelect) {
-                this.selectHighlightedOption(event.target, menuOptions, highlightedOptionIndex);
+                this.handleOptionSelect(event, highlightedOptionIndex);
             }
             else {
                 switch (event.key) {
@@ -1976,18 +2000,32 @@ const Menu = class {
                             this.setHighlightedOption(clickedMultiOptionIndex);
                             this.multiOptionClicked = null;
                         }
-                        else if (highlightedOptionIndex < menuOptions.length - 1) {
-                            this.setHighlightedOption(highlightedOptionIndex + 1);
-                            this.menuOptionId.emit({
-                                optionId: getOptionId(highlightedOptionIndex + 1),
-                            });
-                        }
                         else {
-                            this.setHighlightedOption(0);
-                            this.menuOptionId.emit({
-                                optionId: getOptionId(0),
-                            });
+                            this.handleSingleShiftSelect(event, highlightedOptionIndex, menuOptions);
+                            if (highlightedOptionIndex < menuOptions.length - 1) {
+                                this.setHighlightedOption(highlightedOptionIndex + 1);
+                                this.menuOptionId.emit({
+                                    optionId: getOptionId(highlightedOptionIndex + 1),
+                                });
+                                this.handleSingleShiftSelect(event, highlightedOptionIndex + 1, menuOptions);
+                            }
+                            else {
+                                this.setHighlightedOption(0);
+                                this.menuOptionId.emit({
+                                    optionId: getOptionId(0),
+                                });
+                                this.handleSingleShiftSelect(event, 0, menuOptions);
+                            }
+                            // Deselect currently selected options if arrow was pressed for first time after shift is held
+                            if (this.isMultiSelect && this.shiftPressed) {
+                                this.deselectSelectedOptions([
+                                    highlightedOptionIndex,
+                                    this.getOptionHighlightedIndex(),
+                                ]);
+                                this.shiftPressed = false;
+                            }
                         }
+                        this.lastOptionFocused = this.getOptionHighlightedIndex();
                         this.preventIncorrectTabOrder = false;
                         this.focusFromSearchKeypress = false;
                         break;
@@ -2000,40 +2038,68 @@ const Menu = class {
                             this.setHighlightedOption(clickedMultiOptionIndex);
                             this.multiOptionClicked = null;
                         }
-                        else if (highlightedOptionIndex <= 0 ||
-                            highlightedOptionIndex > menuOptions.length + 1) {
-                            this.setHighlightedOption(menuOptions.length - 1);
-                            this.menuOptionId.emit({
-                                optionId: getOptionId(menuOptions.length - 1),
-                            });
-                        }
                         else {
-                            this.setHighlightedOption(highlightedOptionIndex - 1);
-                            this.menuOptionId.emit({
-                                optionId: getOptionId(highlightedOptionIndex - 1),
-                            });
+                            this.handleSingleShiftSelect(event, highlightedOptionIndex, menuOptions);
+                            if (highlightedOptionIndex <= 0 ||
+                                highlightedOptionIndex > menuOptions.length + 1) {
+                                this.setHighlightedOption(menuOptions.length - 1);
+                                this.menuOptionId.emit({
+                                    optionId: getOptionId(menuOptions.length - 1),
+                                });
+                                this.handleSingleShiftSelect(event, menuOptions.length - 1, menuOptions);
+                            }
+                            else {
+                                this.setHighlightedOption(highlightedOptionIndex - 1);
+                                this.menuOptionId.emit({
+                                    optionId: getOptionId(highlightedOptionIndex - 1),
+                                });
+                                this.handleSingleShiftSelect(event, highlightedOptionIndex - 1, menuOptions);
+                            }
+                            // Deselect currently selected options if arrow was pressed for first time after shift is held
+                            if (this.isMultiSelect && this.shiftPressed) {
+                                this.deselectSelectedOptions([
+                                    highlightedOptionIndex,
+                                    this.getOptionHighlightedIndex(),
+                                ]);
+                                this.shiftPressed = false;
+                            }
                         }
+                        this.lastOptionFocused = this.getOptionHighlightedIndex();
                         this.preventIncorrectTabOrder = false;
                         this.focusFromSearchKeypress = false;
                         break;
-                    case "Home":
+                    case "Home": {
+                        const startOptionIndex = 0;
                         this.keyboardNav = true;
                         event.preventDefault();
                         this.arrowBehaviour(event);
-                        this.setHighlightedOption(0);
+                        this.setHighlightedOption(startOptionIndex);
                         this.menuOptionId.emit({
-                            optionId: getOptionId(0),
+                            optionId: getOptionId(startOptionIndex),
                         });
+                        if (event.shiftKey && event.ctrlKey) {
+                            this.handleMultipleShiftSelect(startOptionIndex);
+                        }
+                        this.lastOptionFocused = startOptionIndex;
+                        this.lastOptionSelected = startOptionIndex;
                         break;
-                    case "End":
+                    }
+                    case "End": {
+                        const endOptionIndex = menuOptions.length - 1;
                         this.keyboardNav = true;
                         event.preventDefault();
                         this.arrowBehaviour(event);
-                        this.setHighlightedOption(menuOptions.length - 1);
+                        this.setHighlightedOption(endOptionIndex);
                         this.menuOptionId.emit({
-                            optionId: getOptionId(menuOptions.length - 1),
+                            optionId: getOptionId(endOptionIndex),
                         });
+                        if (event.shiftKey && event.ctrlKey) {
+                            this.handleMultipleShiftSelect(endOptionIndex);
+                        }
+                        this.lastOptionFocused = endOptionIndex;
+                        this.lastOptionSelected = endOptionIndex;
                         break;
+                    }
                     case " ":
                         if (this.isSearchBar || this.isSearchableSelect) {
                             break;
@@ -2046,7 +2112,7 @@ const Menu = class {
                         break;
                     case "Enter":
                         event.preventDefault();
-                        this.selectHighlightedOption(event.target, menuOptions, highlightedOptionIndex);
+                        this.handleOptionSelect(event, highlightedOptionIndex);
                         break;
                     case "Escape":
                         if (this.open) {
@@ -2061,10 +2127,15 @@ const Menu = class {
                         if ((isMacDevice() && event.metaKey) ||
                             (!isMacDevice() && event.ctrlKey)) {
                             this.emitSelectAll();
+                            this.lastOptionFocused = null;
+                            this.lastOptionSelected = null;
                         }
                         break;
                     case "Shift":
                     case "Tab":
+                        if (event.key === "Shift") {
+                            this.shiftPressed = true;
+                        }
                         if (this.isSearchBar) {
                             this.keyboardNav = true;
                         }
@@ -2130,14 +2201,17 @@ const Menu = class {
         };
         this.handleOptionClick = (event) => {
             const { value, label } = event.target.dataset;
-            this.menuOptionSelect.emit({ value, label });
-            this.optionHighlighted = undefined;
             if (this.isMultiSelect) {
+                const menuOptions = this.getMenuOptions();
+                const selectedOptionIndex = menuOptions.findIndex((option) => option.value === value);
+                this.handleOptionSelect(event, selectedOptionIndex, true);
                 this.multiOptionClicked = value;
             }
             else {
+                this.menuOptionSelect.emit({ value, label });
                 this.handleMenuChange(false);
             }
+            this.optionHighlighted = undefined;
         };
         this.handleRetry = () => {
             this.retryButtonClicked.emit({ value: this.value });
@@ -2157,12 +2231,16 @@ const Menu = class {
                     event.relatedTarget === this.selectAllButton)) {
                     this.handleMenuChange(false, this.hasPreviouslyBlurred);
                     this.menu.removeAttribute(this.activeDescendantAttr);
+                    this.lastOptionFocused = null;
+                    this.lastOptionSelected = null;
                 }
             }
             else {
                 this.handleMenuChange(false);
                 this.preventClickOpen = true;
                 this.menu.removeAttribute(this.activeDescendantAttr);
+                this.lastOptionFocused = null;
+                this.lastOptionSelected = null;
             }
             if (!this.isSearchBar)
                 this.hasPreviouslyBlurred = !!event.relatedTarget;
@@ -2186,11 +2264,16 @@ const Menu = class {
                 this.disabledOptionSelected = false;
                 event.stopImmediatePropagation();
             }
+            if (event.key === "Shift") {
+                this.shiftPressed = false;
+            }
         };
         this.handleSelectAllClick = () => {
             this.keyboardNav = false;
             this.menu.focus();
             this.emitSelectAll();
+            this.lastOptionFocused = null;
+            this.lastOptionSelected = null;
         };
         this.handleSelectAllBlur = (event) => {
             this.el.classList.remove("select-all-focused");
@@ -2200,11 +2283,65 @@ const Menu = class {
         };
         this.handleSelectAllFocus = () => {
             this.el.classList.add("select-all-focused");
+            this.lastOptionFocused = null;
+            this.lastOptionSelected = null;
         };
         // Fix for Safari - select all button click was causing menu to close
         this.handleSelectAllMouseDown = (event) => {
             event.preventDefault();
         };
+        // When shift key is being used to select contiguous options one by one on a multi-select
+        // I.e. holding shift and pressing up and down arrow keys
+        this.handleSingleShiftSelect = (event, optionToSelectIndex, options) => {
+            if (this.isMultiSelect &&
+                event.shiftKey &&
+                !this.isOptionSelected(optionToSelectIndex)) {
+                this.selectHighlightedOption(event.target, options, optionToSelectIndex);
+                this.lastOptionSelected = optionToSelectIndex;
+            }
+        };
+        // When shift key is being used to select multiple options at once on a multi-select
+        // I.e. holding shift when selecting another option
+        this.handleMultipleShiftSelect = (lastOptionInSelection, useFocusForSelection = false, firstOptionSelected = null) => {
+            this.shiftPressed = false;
+            const firstOptionInSelection = firstOptionSelected === null
+                ? this.getFirstOptionInSelection(useFocusForSelection)
+                : firstOptionSelected;
+            if (firstOptionInSelection !== null) {
+                const optionsToSelect = [];
+                if (firstOptionInSelection < lastOptionInSelection) {
+                    for (let i = firstOptionInSelection; i < lastOptionInSelection + 1; i++) {
+                        optionsToSelect.push(i);
+                    }
+                }
+                else {
+                    for (let i = firstOptionInSelection; i > lastOptionInSelection - 1; i--) {
+                        optionsToSelect.push(i);
+                    }
+                }
+                optionsToSelect.forEach((optionIndex) => !this.isOptionSelected(optionIndex) && this.setInputValue(optionIndex));
+                this.deselectSelectedOptions(optionsToSelect);
+            }
+        };
+        this.handleOptionSelect = (event, optionIndex, useFocusForSelection = false) => {
+            const menuOptions = this.getMenuOptions();
+            const firstOptionInSelection = this.getFirstOptionInSelection(useFocusForSelection);
+            if (event.shiftKey && firstOptionInSelection !== null) {
+                this.handleMultipleShiftSelect(optionIndex, useFocusForSelection, firstOptionInSelection);
+            }
+            else {
+                this.selectHighlightedOption(event.target, menuOptions, optionIndex);
+            }
+            this.lastOptionFocused = optionIndex;
+            this.lastOptionSelected = optionIndex;
+        };
+        this.getFirstOptionInSelection = (useFocusForSelection) => {
+            return useFocusForSelection && this.lastOptionFocused !== null
+                ? this.lastOptionFocused
+                : this.lastOptionSelected !== null
+                    ? this.lastOptionSelected
+                    : null;
+        };
         this.emitSelectAll = () => {
             var _a;
             // Select all if there is either no value or not all options are selected
@@ -2303,6 +2440,10 @@ const Menu = class {
             }
             return sorted;
         };
+        this.getOptionHighlightedIndex = () => {
+            const menuOptions = this.getMenuOptions();
+            return menuOptions.findIndex((option) => option[this.valueField] === this.optionHighlighted);
+        };
         this.isManualMode = this.activationType === "manual";
         this.scrollToSelected = (menu) => {
             const selectedOption = this.selectOnEnter
@@ -2393,8 +2534,7 @@ const Menu = class {
         this.parentEl = undefined;
         this.searchMode = "navigation";
         this.selectOnEnter = false;
-        this.size = "default";
-        this.small = false;
+        this.size = "medium";
         this.options = undefined;
         this.value = undefined;
         this.valueField = "value";
@@ -2436,7 +2576,7 @@ const Menu = class {
     }
     componentDidLoad() {
         if (this.isSearchBar &&
-            this.parentEl.disableFilter) {
+            this.parentEl.disableAutoFiltering) {
             this.focusFromSearchKeypress = true;
         }
         onComponentRequiredPropUndefined([
@@ -2544,19 +2684,18 @@ const Menu = class {
         });
     }
     render() {
-        const { inputLabel, options, menuId, value, fullWidth, hasTimedOut, isLoading, size, small, open, inputEl, keyboardNav, } = this;
+        const { inputLabel, options, menuId, value, fullWidth, hasTimedOut, isLoading, size, open, inputEl, keyboardNav, } = this;
         const selectAllButtonText = `${(value === null || value === void 0 ? void 0 : value.length) === this.ungroupedOptions.length ? "Clear" : "Select"} all`;
         const hasNoResults = this.el.classList.contains("no-results");
         return (h(Host, { class: {
-                "full-width": fullWidth,
-                "no-focus": (inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) === "INPUT" ||
+                "ic-menu-full-width": fullWidth,
+                "ic-menu-no-focus": (inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) === "INPUT" ||
                     hasTimedOut ||
                     isLoading ||
                     hasNoResults,
-                small: small,
-                [size]: true,
-                open: open && options.length !== 0,
-                multiple: this.isMultiSelect,
+                [`ic-menu-${size}`]: true,
+                "ic-menu-open": open && options.length !== 0,
+                "ic-menu-multiple": this.isMultiSelect,
             } }, options.length !== 0 && (h("ul", { id: menuId, class: "menu", role: "listbox", "aria-label": `${inputLabel} pop-up`, "aria-multiselectable": this.isMultiSelect ? "true" : "false", tabindex: open && !keyboardNav && (inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) !== "INPUT" ? "0" : "-1", ref: (el) => (this.menu = el), onKeyDown: this.handleMenuKeyDown, onKeyUp: this.handleMenuKeyUp, onBlur: this.handleBlur }, this.getSortedOptions(options).map((option, index) => {
             if (option.children) {
                 if (option.children.length > 0) {
@@ -2580,7 +2719,7 @@ const Menu = class {
             this.isMultiSelect &&
             !isLoading &&
             !hasTimedOut &&
-            !hasNoResults && (h("div", { class: "option-bar" }, h("ic-typography", null, h("p", null, `${value ? value.length : 0}/${getOptionsWithoutGroupTitlesCount(this.options)} selected`)), h("ic-button", { class: "select-all-button", "aria-label": `${selectAllButtonText} options for ${inputLabel}`, ref: (el) => (this.selectAllButton = el), variant: "tertiary", onClick: this.handleSelectAllClick, onMouseDown: this.handleSelectAllMouseDown, onBlur: this.handleSelectAllBlur, onFocus: this.handleSelectAllFocus, size: size === "small" ? "small" : "default" }, selectAllButtonText)))));
+            !hasNoResults && (h("div", { class: "option-bar" }, h("ic-typography", null, h("p", null, `${value ? value.length : 0}/${getOptionsWithoutGroupTitlesCount(this.options)} selected`)), h("ic-button", { class: "select-all-button", "aria-label": `${selectAllButtonText} options for ${inputLabel}`, ref: (el) => (this.selectAllButton = el), variant: "tertiary", onClick: this.handleSelectAllClick, onMouseDown: this.handleSelectAllMouseDown, onBlur: this.handleSelectAllBlur, onFocus: this.handleSelectAllFocus, size: size === "small" ? "small" : "medium" }, selectAllButtonText)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {