@limetech/lime-elements 37.2.2 → 37.2.4

package/dist/lime-elements/p-178a0b8a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["now","root","Date","FUNC_ERROR_TEXT","nativeMax","Math","max","nativeMin","min","debounce","func","wait","options","lastArgs","lastThis","maxWait","result","timerId","lastCallTime","lastInvokeTime","leading","maxing","trailing","TypeError","toNumber","isObject","invokeFunc","time","args","thisArg","undefined","apply","leadingEdge","setTimeout","timerExpired","remainingWait","timeSinceLastCall","timeSinceLastInvoke","timeWaiting","shouldInvoke","trailingEdge","cancel","clearTimeout","flush","debounced","isInvoking","arguments","this","inputFieldCss","InputField","constructor","hostRef","completionsList","initialize","element","limelInputField","shadowRoot","querySelector","mdcTextField","MDCTextField","mapCompletions","window","addEventListener","layout","passive","setFocus","completions","map","item","text","focus","getContainerClassList","classList","label","isInvalid","disabled","readonly","required","value","hasPrefix","hasSuffix","type","helperText","maxlength","leadingIcon","getTrailingIcon","renderInput","properties","h","Object","assign","pattern","onWheel","handleWheel","onKeyDown","placeholder","renderTextarea","class","_a","getAdditionalProps","props","step","Number","isInteger","minlength","onFocus","isFocused","showCompletions","onBlur","isModified","hasHelperText","hasHelperLine","renderHelperLine","length","helperTextId","maxLength","invalid","renderEmptyValueForReadonly","renderSuffix","suffix","renderPrefix","prefix","getInputElement","checkValidity","elementName","renderLabel","labelClassList","id","labelId","renderLeadingIcon","name","renderTrailingLinkOrButton","html","trailingIcon","hasLink","push","renderLinkIcon","getLink","renderTrailingIcon","showLink","includes","href","getHref","target","getTarget","linkProps","icon","tabindex","role","tabIndex","onKeyPress","handleIconKeyPress","onClick","handleIconClick","renderFormattedNumber","renderValue","formatNumber","Intl","NumberFormat","locale","format","event","isForwardTab","key","TAB","keyCode","TAB_KEY_CODE","altKey","metaKey","shiftKey","isUp","ARROW_UP","ARROW_UP_KEY_CODE","isDown","ARROW_DOWN","ARROW_DOWN_KEY_CODE","list","document","portalId","preventDefault","listElement","handleCompletionChange","stopPropagation","detail","changeEmitter","renderAutocompleteList","dropdownZIndex","getComputedStyle","getPropertyValue","visible","containerId","inheritParentWidth","containerStyle","open","allowClicksElement","style","display","onDismiss","handleCloseMenu","renderListResult","filteredCompletions","filterCompletions","onChange","handleKeyDownInDropdown","items","keyFound","ESCAPE","ENTER","keyCodeFound","ESCAPE_KEY_CODE","ENTER_KEY_CODE","filter","completion","toLowerCase","indexOf","handleChange","data","change","emit","action","isEnter","isSpace","SPACE","SPACE_KEY_CODE","globalConfig","defaultLocale","debounceTimeout","createRandomString","connectedCallback","componentDidLoad","disconnectedCallback","destroy","removeEventListener","componentDidUpdate","valid","render","onInput","valueWatcher","newValue","completionsWatcher","RadioButtonTemplate","checked","htmlFor","ListRenderer","defaultConfig","isOpen","badgeIcons","getIndexForWhichToApplyTabIndex","i","selected","renderListItem","index","rendertext","config","renderVariantListItem","classNames","hasPrimaryComponent","attributes","applyTabIndexToItemAtIndex","renderIcon","getPrimaryComponent","renderText","twoLines","avatarList","renderDivider","renderActionMenu","actions","primaryComponent","isSimpleItem","secondaryText","getIconName","color","getIconColor","iconColor","badge","size","iconSize","classes","openDirection","slot","itemTemplate","CheckboxTemplate","renderVariantListItemContent","hasIcons","some","selectableListTypes","selectable","commandKey","PrimaryComponent","listCss","ACTION_EVENT","listStrings","List","listRenderer","setup","setupList","setupListeners","mdcList","teardown","MDCList","hasTypeahead","unlisten","handleAction","multiple","listen","singleSelection","_b","handleSingleSelect","handleMultiSelect","listItems","isListItem","selectedItem","find","selectedItems","listIndex","triggerIconColorWarning","maxLinesSecondaryText","toFixed","Host","handleType","itemsChanged","selectedIndex","findIndex","initializeListType","console","warn","menuSurfaceCss","MenuSurface","menuElement","host","menuSurface","MDCMenuSurface","setAnchorCorner","Corner","TOP_START","handleDocumentClick","capture","handleKeyDown","handleResize","elementPath","composedPath","isDescendant","clickedInAllowedElement","dismiss","preventClickEventPropagation","stopEvent","once","isEscape","isTab"],"sources":["./node_modules/lodash-es/now.js","./node_modules/lodash-es/debounce.js","./src/components/input-field/input-field.scss?tag=limel-input-field&encapsulation=shadow","./src/components/input-field/input-field.tsx","./src/components/list/radio-button/radio-button.template.tsx","./src/components/list/list-renderer.tsx","./src/components/list/list.scss?tag=limel-list&encapsulation=shadow","./src/components/list/list.tsx","./src/components/menu-surface/menu-surface.scss?tag=limel-menu-surface&encapsulation=shadow","./src/components/menu-surface/menu-surface.tsx"],"sourcesContent":["import root from './_root.js';\n\n/**\n * Gets the timestamp of the number of milliseconds that have elapsed since\n * the Unix epoch (1 January 1970 00:00:00 UTC).\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Date\n * @returns {number} Returns the timestamp.\n * @example\n *\n * _.defer(function(stamp) {\n *   console.log(_.now() - stamp);\n * }, _.now());\n * // => Logs the number of milliseconds it took for the deferred invocation.\n */\nvar now = function() {\n  return root.Date.now();\n};\n\nexport default now;\n","import isObject from './isObject.js';\nimport now from './now.js';\nimport toNumber from './toNumber.js';\n\n/** Error message constants. */\nvar FUNC_ERROR_TEXT = 'Expected a function';\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeMax = Math.max,\n    nativeMin = Math.min;\n\n/**\n * Creates a debounced function that delays invoking `func` until after `wait`\n * milliseconds have elapsed since the last time the debounced function was\n * invoked. The debounced function comes with a `cancel` method to cancel\n * delayed `func` invocations and a `flush` method to immediately invoke them.\n * Provide `options` to indicate whether `func` should be invoked on the\n * leading and/or trailing edge of the `wait` timeout. The `func` is invoked\n * with the last arguments provided to the debounced function. Subsequent\n * calls to the debounced function return the result of the last `func`\n * invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the debounced function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.debounce` and `_.throttle`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to debounce.\n * @param {number} [wait=0] The number of milliseconds to delay.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=false]\n *  Specify invoking on the leading edge of the timeout.\n * @param {number} [options.maxWait]\n *  The maximum time `func` is allowed to be delayed before it's invoked.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new debounced function.\n * @example\n *\n * // Avoid costly calculations while the window size is in flux.\n * jQuery(window).on('resize', _.debounce(calculateLayout, 150));\n *\n * // Invoke `sendMail` when clicked, debouncing subsequent calls.\n * jQuery(element).on('click', _.debounce(sendMail, 300, {\n *   'leading': true,\n *   'trailing': false\n * }));\n *\n * // Ensure `batchLog` is invoked once after 1 second of debounced calls.\n * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });\n * var source = new EventSource('/stream');\n * jQuery(source).on('message', debounced);\n *\n * // Cancel the trailing debounced invocation.\n * jQuery(window).on('popstate', debounced.cancel);\n */\nfunction debounce(func, wait, options) {\n  var lastArgs,\n      lastThis,\n      maxWait,\n      result,\n      timerId,\n      lastCallTime,\n      lastInvokeTime = 0,\n      leading = false,\n      maxing = false,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  wait = toNumber(wait) || 0;\n  if (isObject(options)) {\n    leading = !!options.leading;\n    maxing = 'maxWait' in options;\n    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n\n  function invokeFunc(time) {\n    var args = lastArgs,\n        thisArg = lastThis;\n\n    lastArgs = lastThis = undefined;\n    lastInvokeTime = time;\n    result = func.apply(thisArg, args);\n    return result;\n  }\n\n  function leadingEdge(time) {\n    // Reset any `maxWait` timer.\n    lastInvokeTime = time;\n    // Start the timer for the trailing edge.\n    timerId = setTimeout(timerExpired, wait);\n    // Invoke the leading edge.\n    return leading ? invokeFunc(time) : result;\n  }\n\n  function remainingWait(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime,\n        timeWaiting = wait - timeSinceLastCall;\n\n    return maxing\n      ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke)\n      : timeWaiting;\n  }\n\n  function shouldInvoke(time) {\n    var timeSinceLastCall = time - lastCallTime,\n        timeSinceLastInvoke = time - lastInvokeTime;\n\n    // Either this is the first call, activity has stopped and we're at the\n    // trailing edge, the system time has gone backwards and we're treating\n    // it as the trailing edge, or we've hit the `maxWait` limit.\n    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||\n      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));\n  }\n\n  function timerExpired() {\n    var time = now();\n    if (shouldInvoke(time)) {\n      return trailingEdge(time);\n    }\n    // Restart the timer.\n    timerId = setTimeout(timerExpired, remainingWait(time));\n  }\n\n  function trailingEdge(time) {\n    timerId = undefined;\n\n    // Only invoke if we have `lastArgs` which means `func` has been\n    // debounced at least once.\n    if (trailing && lastArgs) {\n      return invokeFunc(time);\n    }\n    lastArgs = lastThis = undefined;\n    return result;\n  }\n\n  function cancel() {\n    if (timerId !== undefined) {\n      clearTimeout(timerId);\n    }\n    lastInvokeTime = 0;\n    lastArgs = lastCallTime = lastThis = timerId = undefined;\n  }\n\n  function flush() {\n    return timerId === undefined ? result : trailingEdge(now());\n  }\n\n  function debounced() {\n    var time = now(),\n        isInvoking = shouldInvoke(time);\n\n    lastArgs = arguments;\n    lastThis = this;\n    lastCallTime = time;\n\n    if (isInvoking) {\n      if (timerId === undefined) {\n        return leadingEdge(lastCallTime);\n      }\n      if (maxing) {\n        // Handle invocations in a tight loop.\n        clearTimeout(timerId);\n        timerId = setTimeout(timerExpired, wait);\n        return invokeFunc(lastCallTime);\n      }\n    }\n    if (timerId === undefined) {\n      timerId = setTimeout(timerExpired, wait);\n    }\n    return result;\n  }\n  debounced.cancel = cancel;\n  debounced.flush = flush;\n  return debounced;\n}\n\nexport default debounce;\n","@use '../../style/internal/z-index';\n@use '../../style/functions';\n@use '../../style/internal/shared_input-select-picker';\n@use '../../style/mixins';\n\n@use '../../style/internal/lime-theme';\n\n@use '@material/textfield';\n@use '@material/textfield/icon';\n@use '@material/notched-outline/mdc-notched-outline';\n@use '@material/floating-label';\n@use '@material/floating-label/mdc-floating-label';\n@use '@material/ripple';\n@use '@material/list';\n@use '@material/elevation';\n@use '@material/menu-surface';\n\n/**\n * @prop --textarea-height: Height of the field when type is set to `textarea`\n */\n\n:host {\n    position: relative;\n    display: block;\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n:host([type='textarea']) {\n    height: var(--textarea-height, 100%);\n\n    .mdc-text-field.mdc-text-field--textarea {\n        height: var(--textarea-height, 100%);\n\n        .mdc-text-field__input {\n            margin-top: functions.pxToRem(8);\n            margin-bottom: 0;\n        }\n    }\n}\n\n@include mixins.hide-helper-line-when-not-needed(limel-input-field);\n\n@include textfield.core-styles;\n@include icon.icon-core-styles;\n\n@include shared_input-select-picker.outlined-style-overrides;\n@include shared_input-select-picker.readonly-overrides;\n@include shared_input-select-picker.cropped-label-hack;\n@include shared_input-select-picker.disabled-overrides;\n@include shared_input-select-picker.leading-icon;\n@include shared_input-select-picker.trailing-icon;\n@include shared_input-select-picker.floating-label-overrides;\n@include shared_input-select-picker.lime-empty-value-for-readonly;\n@include shared_input-select-picker.lime-looks-like-input-value;\n\n.mdc-text-field--with-trailing-icon {\n    .mdc-text-field__icon--trailing {\n        margin-right: functions.pxToRem(8);\n    }\n}\n\n.lime-text-field--empty {\n    .mdc-text-field__icon--trailing {\n        @include shared_input-select-picker.looks-disabled;\n        box-shadow: none !important;\n    }\n}\n\n.mdc-text-field {\n    width: 100%;\n\n    &:not(.mdc-text-field--disabled) {\n        .mdc-text-field__affix,\n        .mdc-text-field__icon {\n            color: rgb(var(--contrast-900));\n        }\n    }\n    &.mdc-text-field--disabled {\n        .mdc-text-field__affix,\n        .mdc-text-field__icon {\n            color: rgb(var(--contrast-700));\n        }\n    }\n}\n\n.lime-formatted-input {\n    display: none;\n    width: calc(100% - #{functions.pxToRem(20)});\n    z-index: z-index.$input-field--formatted-value;\n\n    pointer-events: none;\n\n    :not(.mdc-text-field--focused):not(.mdc-text-field--invalid) & {\n        display: block;\n    }\n\n    + .mdc-text-field__input {\n        z-index: z-index.$input-field--input-with-formatted-value;\n    }\n}\n\n:not(.mdc-text-field--focused):not(.mdc-text-field--invalid) {\n    .mdc-text-field__input[type='number'] {\n        color: transparent;\n        -webkit-text-fill-color: transparent;\n    }\n\n    &.lime-text-field--readonly {\n        .mdc-text-field__input[type='number'] {\n            visibility: hidden;\n            // Not having `visibility: hidden;` makes the unformatted\n            // value selectable; which is not so nice when users\n            // click drag to select content on the screen.\n            // The reason to have it only on `readonly` mode is\n            // 1. This is the use case where it makes most sense\n            // 2. We don't want to repeat the same thing in the\n            // accessibility tree, and make it readable for assistive\n            // technologies.\n            // 3. When not readonly, clicking on the `<input />`\n            // element sets the focus and activates the edit mode.\n            // So we cannot always have it `hidden` on.\n            // which is why we have instead\n            // `color: transparent` a few lines before this.\n        }\n    }\n}\n\n.autocomplete-list-container {\n    position: relative;\n}\n\n.autocomplete-list {\n    background-color: var(--lime-elevated-surface-background-color);\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    max-height: functions.pxToRem(200);\n    overflow-y: auto;\n}\n\n.mdc-deprecated-list-item {\n    cursor: pointer;\n}\n\ninput.mdc-text-field__input {\n    @include shared_input-select-picker.input-field-placeholder;\n\n    &::-webkit-search-cancel-button {\n        @include mixins.clear-all-button;\n\n        -webkit-appearance: none;\n\n        position: absolute;\n        right: 0;\n        top: 0;\n        bottom: 0;\n        margin: auto;\n\n        &:active {\n            transform: none; //Makes the \"clear-all button\" work\n        }\n        .mdc-text-field--label-floating & {\n            opacity: 1;\n        }\n    }\n}\n\n@import './partial-styles/trailing-icon.scss';\n@import './partial-styles/readonly';\n","import { MDCTextField } from '@material/textfield';\nimport {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n    State,\n    Watch,\n} from '@stencil/core';\nimport { debounce } from 'lodash-es';\nimport {\n    ARROW_DOWN,\n    ARROW_DOWN_KEY_CODE,\n    ARROW_UP,\n    ARROW_UP_KEY_CODE,\n    ENTER,\n    ENTER_KEY_CODE,\n    ESCAPE,\n    ESCAPE_KEY_CODE,\n    SPACE,\n    SPACE_KEY_CODE,\n    TAB,\n    TAB_KEY_CODE,\n} from '../../util/keycodes';\nimport { InputType } from '../input-field/input-field.types';\nimport { ListItem } from '../list/list-item.types';\nimport { getHref, getTarget } from '../../util/link-helper';\nimport { JSXBase } from '@stencil/core/internal';\nimport { createRandomString } from '../../util/random-string';\nimport { LimelListCustomEvent } from 'src/components';\nimport { globalConfig } from '../../global/config';\n\ninterface LinkProperties {\n    href: string;\n    target?: string;\n}\n\n/**\n * @exampleComponent limel-example-input-field-text\n * @exampleComponent limel-example-input-field-placeholder\n * @exampleComponent limel-example-input-field-text-multiple\n * @exampleComponent limel-example-input-field-number\n * @exampleComponent limel-example-input-field-autocomplete\n * @exampleComponent limel-example-input-field-icon-leading\n * @exampleComponent limel-example-input-field-icon-trailing\n * @exampleComponent limel-example-input-field-icon-both\n * @exampleComponent limel-example-input-field-showlink\n * @exampleComponent limel-example-input-field-error-icon\n * @exampleComponent limel-example-input-field-textarea\n * @exampleComponent limel-example-input-field-suffix\n * @exampleComponent limel-example-input-field-prefix\n * @exampleComponent limel-example-input-field-search\n * @exampleComponent limel-example-input-field-pattern\n * @exampleComponent limel-example-input-field-focus\n */\n@Component({\n    tag: 'limel-input-field',\n    shadow: true,\n    styleUrl: 'input-field.scss',\n})\nexport class InputField {\n    /**\n     * Set to `true` to disable the field.\n     * Use `disabled` to indicate that the field can normally be interacted\n     * with, but is currently disabled. This tells the user that if certain\n     * requirements are met, the field may become enabled again.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    /**\n     * Set to `true` to make the field read-only.\n     * Use `readonly` when the field is only there to present the data it holds,\n     * and will not become possible for the current user to edit.\n     */\n    @Prop({ reflect: true })\n    public readonly = false;\n\n    /**\n     * Set to `true` to indicate that the current value of the input field is\n     * invalid.\n     */\n    @Prop({ reflect: true })\n    public invalid = false;\n\n    /**\n     * The input label.\n     */\n    @Prop({ reflect: true })\n    public label: string;\n\n    /**\n     * The placeholder text shown inside the input field, when the field is focused and empty.\n     */\n    @Prop({ reflect: true })\n    public placeholder: string;\n\n    /**\n     * Optional helper text to display below the input field when it has focus\n     */\n    @Prop({ reflect: true })\n    public helperText: string;\n\n    /**\n     * A short piece of text to display before the value inside the input field.\n     * Displayed for all types except `textarea`.\n     */\n    @Prop({ reflect: true })\n    public prefix: string;\n\n    /**\n     * A short piece of text to display after the value inside the input field.\n     * Displayed for all types except `textarea`.\n     */\n    @Prop({ reflect: true })\n    public suffix: string;\n\n    /**\n     * Set to `true` to indicate that the field is required.\n     */\n    @Prop({ reflect: true })\n    public required = false;\n\n    /**\n     * The value of the field.\n     */\n    @Prop({ reflect: true })\n    public value: string;\n\n    /**\n     * Trailing icon to show to the far right in the field.\n     */\n    @Prop({ reflect: true })\n    public trailingIcon: string;\n\n    /**\n     * Leading icon to show to the far left in the field.\n     */\n    @Prop({ reflect: true })\n    public leadingIcon: string;\n\n    /**\n     * Regular expression that the current value of the input field must match.\n     * No forward slashes should be specified around the pattern.\n     * Only used if type is `text`, `tel`, `email`, `url`, `urlAsText`,\n     * `password`, or `search`.\n     */\n    @Prop({ reflect: true })\n    public pattern: string;\n\n    /**\n     * Type of input.\n     *\n     * Note** regarding type `url`: `limel-input` uses the native validation\n     * built into the browser for many types of input fields. The native\n     * validation for `url` is very strict, and does not allow relative urls,\n     * nor any other formats that are not a \"fully qualified\" url. To allow\n     * such urls, use the type `urlAsText` instead. `urlAsText` works exactly\n     * like `text` in all regards, except that it enables use of the `showLink`\n     * property.\n     */\n    @Prop({ reflect: true })\n    public type: InputType = 'text';\n\n    /**\n     * Set to `true` to format the current value of the input field only\n     * if the field is of type number.\n     * The number format is determined by the current language of the browser.\n     */\n    @Prop({ reflect: true })\n    public formatNumber = true;\n\n    /**\n     * Incremental values that are valid if the field type is `number`.\n     */\n    @Prop({ reflect: true })\n    public step: number | 'any' = 'any';\n\n    /**\n     * Maximum allowed value if input type is `number`.\n     */\n    @Prop({ reflect: true })\n    public max: number;\n\n    /**\n     * Minimum allowed value if input type is `number`.\n     */\n    @Prop({ reflect: true })\n    public min: number;\n\n    /**\n     * Maximum length of the value if type is `password`, `search`, `tel`,\n     * `text`, `url`, or `urlAsText`.\n     */\n    @Prop({ reflect: true })\n    public maxlength: number;\n\n    /**\n     * Minimum length of the value if type is `password`, `search`, `tel`,\n     * `text`, `url`, or `urlAsText`.\n     */\n    @Prop({ reflect: true })\n    public minlength: number;\n\n    /**\n     * list of suggestions `value` can autocomplete to.\n     */\n    @Prop()\n    public completions: string[] = [];\n\n    /**\n     * For inputs of type `email`, `tel`, `url`, and `urlAsText`, set this to\n     * `true` to show a trailing icon with a `mailto:`,`tel:`, or normal link,\n     * respectively. The default icon can be overridden using the `trailingIcon`\n     * property.\n     */\n    @Prop({ reflect: true })\n    public showLink = false;\n\n    /**\n     * The locale to use for formatting numbers.\n     */\n    @Prop({ reflect: true })\n    public locale: string = globalConfig.defaultLocale;\n\n    /**\n     * Emitted when the input value is changed.\n     */\n    @Event()\n    private change: EventEmitter<string>;\n\n    /**\n     * Emitted when `trailingIcon` or `leadingIcon` is set\n     * and the icon is interacted with.\n     */\n    @Event()\n    private action: EventEmitter<void>;\n\n    @Element()\n    private limelInputField: HTMLLimelInputFieldElement;\n\n    @State()\n    private isFocused: boolean = false;\n\n    @State()\n    private isModified: boolean = false;\n\n    @State()\n    public showCompletions: boolean = false;\n\n    private mdcTextField: MDCTextField;\n    private completionsList: ListItem[] = [];\n    private portalId: string;\n    private helperTextId: string;\n    private labelId: string;\n\n    constructor() {\n        const debounceTimeout = 300;\n        this.changeEmitter = debounce(this.changeEmitter, debounceTimeout);\n\n        this.portalId = createRandomString();\n        this.helperTextId = createRandomString();\n        this.labelId = createRandomString();\n    }\n\n    public connectedCallback() {\n        this.initialize();\n    }\n\n    public componentDidLoad() {\n        this.initialize();\n    }\n\n    public disconnectedCallback() {\n        if (this.mdcTextField) {\n            this.mdcTextField.destroy();\n        }\n\n        window.removeEventListener('resize', this.layout);\n        this.limelInputField.removeEventListener('focus', this.setFocus);\n    }\n\n    public componentDidUpdate() {\n        if (this.invalid) {\n            this.mdcTextField.valid = false;\n        }\n    }\n\n    public render() {\n        const properties = this.getAdditionalProps();\n        properties['aria-labelledby'] = this.labelId;\n        properties.class = 'mdc-text-field__input';\n        properties.onInput = this.handleChange;\n        properties.onFocus = this.onFocus;\n        properties.onBlur = this.onBlur;\n        properties.required = this.required;\n        properties.readonly = this.readonly;\n        properties.disabled = this.disabled || this.readonly;\n\n        if (this.hasHelperText()) {\n            properties['aria-controls'] = this.helperTextId;\n            properties['aria-describedby'] = this.helperTextId;\n        }\n\n        return [\n            <label class={this.getContainerClassList()}>\n                <span class=\"mdc-notched-outline\" tabindex=\"-1\">\n                    <span class=\"mdc-notched-outline__leading\"></span>\n                    {this.renderLabel()}\n                    <span class=\"mdc-notched-outline__trailing\"></span>\n                </span>\n                {this.renderLeadingIcon()}\n                {this.renderEmptyValueForReadonly()}\n                {this.renderPrefix()}\n                {this.renderFormattedNumber()}\n                {this.renderInput(properties)}\n                {this.renderSuffix()}\n                {this.renderTextarea(properties)}\n                {this.renderTrailingLinkOrButton()}\n            </label>,\n            this.renderHelperLine(),\n            this.renderAutocompleteList(),\n        ];\n    }\n\n    @Watch('value')\n    protected valueWatcher(newValue: string) {\n        if (!this.mdcTextField) {\n            return;\n        }\n\n        if (newValue !== this.mdcTextField.value) {\n            this.mdcTextField.value = newValue || '';\n        }\n    }\n\n    @Watch('completions')\n    protected completionsWatcher() {\n        this.mapCompletions();\n    }\n\n    private initialize = () => {\n        const element =\n            this.limelInputField.shadowRoot.querySelector('.mdc-text-field');\n        if (!element) {\n            return;\n        }\n\n        this.mdcTextField = new MDCTextField(element);\n\n        this.mapCompletions();\n\n        window.addEventListener('resize', this.layout, { passive: true });\n        this.limelInputField.addEventListener('focus', this.setFocus);\n    };\n\n    private mapCompletions = () => {\n        this.completionsList = [...this.completions].map((item) => {\n            return { text: item };\n        });\n    };\n\n    private setFocus = () => {\n        this.mdcTextField.focus();\n    };\n\n    private getContainerClassList = () => {\n        const classList = {\n            'mdc-text-field': true,\n            'mdc-text-field--no-label': !this.label,\n            'mdc-text-field--outlined': true,\n            'mdc-text-field--invalid': this.isInvalid(),\n            'mdc-text-field--disabled': this.disabled || this.readonly,\n            'lime-text-field--readonly': this.readonly,\n            'mdc-text-field--required': this.required,\n            'lime-text-field--empty': !this.value,\n            'lime-has-prefix': this.hasPrefix(),\n            'lime-has-suffix': this.hasSuffix(),\n        };\n\n        if (this.type === 'textarea') {\n            classList['mdc-text-field--textarea'] = true;\n            classList['has-helper-line'] =\n                !!this.helperText || !!this.maxlength;\n        } else {\n            classList['mdc-text-field--with-leading-icon'] = !!this.leadingIcon;\n            classList['mdc-text-field--with-trailing-icon'] =\n                !!this.getTrailingIcon();\n        }\n\n        return classList;\n    };\n\n    private renderInput = (\n        properties: JSXBase.InputHTMLAttributes<HTMLInputElement>,\n    ) => {\n        if (this.type === 'textarea') {\n            return;\n        }\n\n        const type = this.type === 'urlAsText' ? 'text' : this.type;\n\n        return (\n            <input\n                {...properties}\n                type={type}\n                pattern={this.pattern}\n                onWheel={this.handleWheel}\n                onKeyDown={this.onKeyDown}\n                value={this.value}\n                placeholder={this.placeholder}\n            />\n        );\n    };\n\n    private renderTextarea = (\n        properties: JSXBase.TextareaHTMLAttributes<HTMLTextAreaElement>,\n    ) => {\n        if (this.type !== 'textarea') {\n            return;\n        }\n\n        return (\n            <span class=\"mdc-text-field__resizer\">\n                <textarea {...properties} placeholder={this.placeholder}>\n                    {this.value}\n                </textarea>\n            </span>\n        );\n    };\n\n    private layout = () => {\n        this.mdcTextField?.layout();\n    };\n\n    private getAdditionalProps = () => {\n        const props: any = {};\n\n        if (this.type === 'number') {\n            props.step = this.step;\n        }\n\n        if (this.type === 'number' && Number.isInteger(this.min)) {\n            props.min = this.min;\n        }\n\n        if (this.type === 'number' && Number.isInteger(this.max)) {\n            props.max = this.max;\n        }\n\n        if (this.minlength) {\n            props.minlength = this.minlength;\n        }\n\n        if (this.maxlength) {\n            props.maxlength = this.maxlength;\n        }\n\n        return props;\n    };\n\n    private onFocus = () => {\n        this.isFocused = true;\n        this.showCompletions = true;\n    };\n\n    private onBlur = () => {\n        this.isFocused = false;\n        this.isModified = true;\n    };\n\n    private hasHelperText = () => {\n        return this.helperText !== null && this.helperText !== undefined;\n    };\n\n    private hasHelperLine = () => {\n        return this.maxlength || this.hasHelperText();\n    };\n\n    private renderHelperLine = () => {\n        const text: string = this.value || '';\n        const length = text.length;\n\n        if (!this.hasHelperLine()) {\n            return;\n        }\n\n        return (\n            <limel-helper-line\n                helperTextId={this.helperTextId}\n                helperText={this.helperText}\n                length={length}\n                maxLength={this.maxlength}\n                invalid={this.isInvalid()}\n            />\n        );\n    };\n\n    private renderEmptyValueForReadonly = () => {\n        if (this.readonly && !this.value) {\n            return (\n                <span class=\"lime-empty-value-for-readonly lime-looks-like-input-value\">\n                    –\n                </span>\n            );\n        }\n    };\n\n    private renderSuffix = () => {\n        if (!this.hasSuffix() || this.type === 'textarea') {\n            return;\n        }\n\n        const classList = {\n            'mdc-text-field__affix': true,\n            'mdc-text-field__affix--suffix': true,\n        };\n\n        return <span class={classList}>{this.suffix}</span>;\n    };\n\n    private hasSuffix = () => {\n        return this.suffix !== null && this.suffix !== undefined;\n    };\n\n    private renderPrefix = () => {\n        if (!this.hasPrefix() || this.type === 'textarea') {\n            return;\n        }\n\n        const classList = {\n            'mdc-text-field__affix': true,\n            'mdc-text-field__affix--prefix': true,\n        };\n\n        return <span class={classList}>{this.prefix}</span>;\n    };\n\n    private hasPrefix = () => {\n        return this.prefix !== null && this.prefix !== undefined;\n    };\n\n    private isInvalid = () => {\n        if (this.readonly) {\n            // A readonly field can never be invalid.\n            return false;\n        }\n\n        if (this.invalid) {\n            // `this.invalid` is set by the consumer. If the consumer explicitly\n            // told us to consider the field invalid, we consider it invalid\n            // regardless of what our internal validation thinks, and regardless\n            // of whether the field has been modified.\n            return true;\n        }\n\n        if (!this.isModified) {\n            return false;\n        }\n\n        const element = this.getInputElement();\n\n        return !(element && element.checkValidity());\n    };\n\n    private getInputElement = (): HTMLInputElement | HTMLTextAreaElement => {\n        let elementName = 'input';\n        if (this.type === 'textarea') {\n            elementName = 'textarea';\n        }\n\n        return this.limelInputField.shadowRoot.querySelector(elementName);\n    };\n\n    private renderLabel = () => {\n        const labelClassList = {\n            'mdc-floating-label': true,\n            'mdc-floating-label--float-above':\n                !!this.value || this.isFocused || this.readonly,\n        };\n\n        if (!this.label) {\n            return;\n        }\n\n        return (\n            <span class=\"mdc-notched-outline__notch\">\n                <span class={labelClassList} id={this.labelId}>\n                    {this.label}\n                </span>\n            </span>\n        );\n    };\n\n    private renderLeadingIcon = () => {\n        if (this.type === 'textarea') {\n            return;\n        }\n\n        if (this.leadingIcon) {\n            return (\n                <i class=\"material-icons mdc-text-field__icon mdc-text-field__icon--leading\">\n                    <limel-icon name={this.leadingIcon} />\n                </i>\n            );\n        }\n    };\n\n    private renderTrailingLinkOrButton = () => {\n        if (this.type === 'textarea') {\n            return;\n        }\n\n        const html = [];\n\n        const trailingIcon = this.getTrailingIcon();\n\n        if (!this.isInvalid() && this.hasLink()) {\n            html.push(this.renderLinkIcon(this.getLink(), trailingIcon));\n        } else if (trailingIcon) {\n            html.push(this.renderTrailingIcon(trailingIcon));\n        }\n\n        return html;\n    };\n\n    private hasLink = () => {\n        return (\n            this.showLink &&\n            ['email', 'tel', 'url', 'urlAsText'].includes(this.type)\n        );\n    };\n\n    private getLink = () => {\n        const props: LinkProperties = { href: '' };\n        switch (this.type) {\n            case 'email':\n                props.href = `mailto:${this.value}`;\n                break;\n            case 'tel':\n                props.href = `tel:${this.value}`;\n                break;\n            default:\n                props.href = getHref(this.value);\n                props.target = getTarget(this.value);\n        }\n\n        return props;\n    };\n\n    private renderLinkIcon = (linkProps: LinkProperties, icon: string) => {\n        // If the trailing icon uses the class `mdc-text-field__icon--trailing`,\n        // MDC attaches a click handler to it, which apparently runs\n        // `preventDefault()` on the event. For links, we don't want that,\n        // so instead of `mdc-text-field__icon--trailing`, we use our own class\n        // `lime-trailing-icon-for-link`, which uses all the same styling. /Ads\n        return (\n            <a\n                {...linkProps}\n                class=\"material-icons mdc-text-field__icon lime-trailing-icon-for-link\"\n                tabindex={this.disabled || !this.value ? '-1' : '0'}\n                role=\"button\"\n            >\n                <limel-icon name={icon} />\n            </a>\n        );\n    };\n\n    private renderTrailingIcon = (icon: string) => {\n        const props: any = {\n            tabIndex: this.isInvalid() ? '-1' : '0',\n        };\n        if (!this.isInvalid()) {\n            props.onKeyPress = this.handleIconKeyPress;\n            props.onClick = this.handleIconClick;\n            props.role = 'button';\n        }\n\n        return (\n            <i\n                class=\"material-icons mdc-text-field__icon mdc-text-field__icon--trailing\"\n                {...props}\n            >\n                <limel-icon name={icon} />\n            </i>\n        );\n    };\n\n    private getTrailingIcon = () => {\n        if (this.isInvalid()) {\n            return 'high_importance';\n        }\n\n        if (this.trailingIcon) {\n            return this.trailingIcon;\n        }\n\n        if (this.showLink && this.type === 'email') {\n            return 'filled_message';\n        }\n\n        if (this.showLink && this.type === 'tel') {\n            return 'phone';\n        }\n\n        if (\n            this.showLink &&\n            (this.type === 'url' || this.type === 'urlAsText')\n        ) {\n            return 'external_link';\n        }\n    };\n\n    private renderFormattedNumber = () => {\n        if (this.type !== 'number') {\n            return;\n        }\n\n        let renderValue = this.value;\n        if (this.formatNumber && this.value) {\n            renderValue = new Intl.NumberFormat(this.locale).format(\n                Number(this.value),\n            );\n        }\n\n        return (\n            <span class=\"lime-formatted-input lime-looks-like-input-value\">\n                {renderValue}\n            </span>\n        );\n    };\n\n    /**\n     * Key handler for the input field\n     * Will change focus to the first/last item in the dropdown list to enable selection with the keyboard\n     *\n     * @param event - event\n     */\n\n    private onKeyDown = (event: KeyboardEvent): void => {\n        this.showCompletions = true;\n        const isForwardTab =\n            (event.key === TAB || event.keyCode === TAB_KEY_CODE) &&\n            !event.altKey &&\n            !event.metaKey &&\n            !event.shiftKey;\n        const isUp =\n            event.key === ARROW_UP || event.keyCode === ARROW_UP_KEY_CODE;\n        const isDown =\n            event.key === ARROW_DOWN || event.keyCode === ARROW_DOWN_KEY_CODE;\n\n        if (event.keyCode === TAB_KEY_CODE && event.shiftKey) {\n            this.showCompletions = false;\n        }\n\n        if (!isForwardTab && !isUp && !isDown) {\n            return;\n        }\n\n        const list = document.querySelector(` #${this.portalId} limel-list`);\n\n        if (!list) {\n            return;\n        }\n\n        event.preventDefault();\n        if (isForwardTab || isDown) {\n            const listElement: HTMLElement = list.shadowRoot.querySelector(\n                '.mdc-deprecated-list-item:first-child',\n            );\n            listElement.focus();\n\n            return;\n        }\n\n        if (isUp) {\n            const listElement: HTMLElement = list.shadowRoot.querySelector(\n                '.mdc-deprecated-list-item:last-child',\n            );\n            listElement.focus();\n        }\n    };\n\n    private handleCompletionChange = (\n        event: LimelListCustomEvent<ListItem>,\n    ) => {\n        event.stopPropagation();\n        if (!event.detail) {\n            return;\n        }\n\n        this.showCompletions = false;\n\n        /*\n         This change event doesn't need to be debounced in itself, but we want\n         to make absolutely sure that an earlier change event that *has* been\n         debounced doesn't emit after this one. Therefore, we run this through\n         the same debounced emitter function. /Ads\n         */\n        this.changeEmitter(event.detail.text);\n    };\n\n    private renderAutocompleteList = () => {\n        if (this.type === 'textarea' || !this.completions.length) {\n            return;\n        }\n\n        const dropdownZIndex = getComputedStyle(\n            this.limelInputField,\n        ).getPropertyValue('--dropdown-z-index');\n\n        return (\n            <limel-portal\n                visible={this.showCompletions}\n                containerId={this.portalId}\n                inheritParentWidth={true}\n                containerStyle={{ 'z-index': dropdownZIndex }}\n            >\n                <limel-menu-surface\n                    open={this.showCompletions}\n                    allowClicksElement={this.limelInputField}\n                    style={{\n                        '--mdc-menu-min-width': '100%',\n                        'max-height': 'inherit',\n                        display: 'flex',\n                    }}\n                    onDismiss={this.handleCloseMenu}\n                >\n                    {this.renderListResult()}\n                </limel-menu-surface>\n            </limel-portal>\n        );\n    };\n\n    private renderListResult = () => {\n        const filteredCompletions: ListItem[] = this.filterCompletions(\n            this.value,\n        );\n        if (!filteredCompletions || filteredCompletions.length === 0) {\n            return null;\n        }\n\n        return (\n            <limel-list\n                onChange={this.handleCompletionChange}\n                onKeyDown={this.handleKeyDownInDropdown}\n                type=\"selectable\"\n                items={filteredCompletions}\n            />\n        );\n    };\n\n    private handleKeyDownInDropdown = (event: KeyboardEvent) => {\n        const keyFound = [TAB, ESCAPE, ENTER].includes(event.key);\n        const keyCodeFound = [\n            TAB_KEY_CODE,\n            ESCAPE_KEY_CODE,\n            ENTER_KEY_CODE,\n        ].includes(event.keyCode);\n        if (keyFound || keyCodeFound) {\n            this.setFocus();\n        }\n    };\n\n    private handleCloseMenu = () => {\n        this.showCompletions = false;\n    };\n\n    private filterCompletions = (filter: string) => {\n        if (!filter) {\n            return this.completionsList;\n        }\n\n        return this.completionsList.filter(\n            (completion) =>\n                completion.text.toLowerCase().indexOf(filter.toLowerCase()) >\n                -1,\n        );\n    };\n\n    private handleChange = (event) => {\n        event.stopPropagation();\n        let value = event.target.value;\n\n        if (this.type === 'number') {\n            if (!value && event.data) {\n                event.stopPropagation();\n\n                return;\n            }\n\n            if (value) {\n                value = Number(value);\n            }\n        }\n\n        this.changeEmitter(value);\n    };\n\n    private changeEmitter = (value: string) => {\n        this.change.emit(value);\n    };\n\n    private handleIconClick = () => {\n        if (!this.isInvalid()) {\n            this.action.emit();\n        }\n    };\n\n    private handleIconKeyPress = (event: KeyboardEvent) => {\n        const isEnter = event.key === ENTER || event.keyCode === ENTER_KEY_CODE;\n        const isSpace = event.key === SPACE || event.keyCode === SPACE_KEY_CODE;\n\n        if ((isSpace || isEnter) && !this.isInvalid()) {\n            this.action.emit();\n        }\n    };\n\n    private handleWheel = () => {\n        // This empty event handler is here to circumvent a bug.\n        // In some browsers (Chrome for example), hovering the input with\n        // the input focused, and scrolling, will both change the value\n        // AND scroll the page. We would prefer to never change the value\n        // on scroll, instead always scrolling the page, but since we\n        // haven't found a way to do that, this is the next best thing, as\n        // it prevents the page from being scrolled, but only in the\n        // circumstances when the value is changed by the scrolling.\n        // Please test THOROUGHLY if you remove this event handler 😄\n    };\n}\n","import { FunctionalComponent, h } from '@stencil/core';\n\ninterface RadioButtonTemplateProps {\n    disabled?: boolean;\n    id: string;\n    checked?: boolean;\n    onChange?: (event: Event) => void;\n    label?: string;\n}\n\nexport const RadioButtonTemplate: FunctionalComponent<\n    RadioButtonTemplateProps\n> = (props) => {\n    return (\n        <div class=\"mdc-form-field\">\n            <div\n                class={`\n                        mdc-radio\n                        ${props.disabled ? 'mdc-radio--disabled' : ''}\n                    `}\n            >\n                <input\n                    class=\"mdc-radio__native-control\"\n                    type=\"radio\"\n                    id={props.id}\n                    checked={props.checked}\n                    disabled={props.disabled}\n                    onChange={props.onChange}\n                />\n                <div class=\"mdc-radio__background\">\n                    <div class=\"mdc-radio__outer-circle\" />\n                    <div class=\"mdc-radio__inner-circle\" />\n                </div>\n            </div>\n            <label\n                class={`${props.disabled ? 'disabled' : ''}`}\n                htmlFor={props.id}\n            >\n                {props.label}\n            </label>\n        </div>\n    );\n};\n","import { ListItem, ListSeparator } from '../list/list-item.types';\nimport { MenuItem } from '../menu/menu.types';\nimport { h } from '@stencil/core';\nimport { CheckboxTemplate } from '../checkbox/checkbox.template';\nimport { ListRendererConfig } from './list-renderer-config';\nimport { RadioButtonTemplate } from './radio-button/radio-button.template';\nimport { getIconColor, getIconName } from '../icon/get-icon-props';\n\nexport class ListRenderer {\n    private defaultConfig: ListRendererConfig = {\n        isOpen: true,\n        badgeIcons: false,\n    };\n\n    private config: ListRendererConfig;\n\n    private hasIcons: boolean;\n    private twoLines: boolean;\n    private avatarList: boolean;\n    private commandKey: boolean;\n\n    private applyTabIndexToItemAtIndex: number;\n\n    public render(\n        items: Array<ListItem | ListSeparator>,\n        config: ListRendererConfig = {},\n    ) {\n        items = items || [];\n        this.config = { ...this.defaultConfig, ...config };\n\n        this.twoLines = items.some((item) => {\n            return 'secondaryText' in item && !!item.secondaryText;\n        });\n\n        this.hasIcons = items.some((item) => {\n            return 'icon' in item && !!item.icon;\n        });\n\n        this.avatarList = this.config.badgeIcons && this.hasIcons;\n        const selectableListTypes = ['selectable', 'radio', 'checkbox'];\n\n        let role;\n        switch (this.config.type) {\n            case 'checkbox':\n                role = 'group';\n                break;\n            case 'radio':\n                role = 'radiogroup';\n                break;\n            default:\n                role = 'listbox';\n        }\n\n        this.applyTabIndexToItemAtIndex =\n            this.getIndexForWhichToApplyTabIndex(items);\n\n        const classNames = {\n            'mdc-deprecated-list': true,\n            'mdc-deprecated-list--two-line': this.twoLines,\n            selectable: selectableListTypes.includes(this.config.type),\n            'mdc-deprecated-list--avatar-list': this.avatarList,\n            'list--compact':\n                this.twoLines &&\n                this.commandKey &&\n                ['small', 'x-small'].includes(this.config.iconSize),\n        };\n\n        return (\n            <ul class={classNames} role={role} aria-orientation=\"vertical\">\n                {items.map(this.renderListItem)}\n            </ul>\n        );\n    }\n\n    /**\n     * Determine which ListItem should have the `tab-index` attribute set,\n     * and return the index at which that ListItem is located in `items`.\n     * Returns `undefined` if no item should have the attribute set.\n     * See https://github.com/material-components/material-components-web/tree/e66a43a75fef4f9179e24856649518e15e279a04/packages/mdc-list#accessibility\n     *\n     * @param items - the items of the list, including any `ListSeparator`:s\n     * @returns the index as per the description\n     */\n    private getIndexForWhichToApplyTabIndex = (\n        items: Array<ListItem | ListSeparator>,\n    ) => {\n        let result;\n        for (let i = 0, max = items.length; i < max; i += 1) {\n            if ('separator' in items[i]) {\n                // Ignore ListSeparator\n            } else {\n                const item = items[i] as ListItem<any>;\n                if (item.selected) {\n                    result = i;\n                    break;\n                }\n\n                if (result === undefined && !item.disabled) {\n                    result = i;\n                    // Do NOT break, as any later item with\n                    // `selected=true` should get the tab-index instead!\n                }\n            }\n        }\n\n        return result;\n    };\n\n    /**\n     * Render a single list item\n     *\n     * @param item - the item to render\n     * @param index - the index the item had in the `items` array\n     * @returns the list item\n     */\n    private renderListItem = (\n        item: ListItem | ListSeparator,\n        index: number,\n    ) => {\n        if ('separator' in item) {\n            return (\n                <li class=\"mdc-deprecated-list-divider\" role=\"separator\">\n                    {this.rendertext(item)}\n                    <div class=\"limel-list-divider-line\" />\n                </li>\n            );\n        }\n\n        if (['radio', 'checkbox'].includes(this.config.type)) {\n            return this.renderVariantListItem(this.config, item, index);\n        }\n\n        const classNames = {\n            'mdc-deprecated-list-item': true,\n            'mdc-deprecated-list-item--disabled': item.disabled,\n            'mdc-deprecated-list-item--selected': item.selected,\n            'has-primary-component': this.hasPrimaryComponent(item),\n        };\n\n        const attributes: { tabindex?: string } = {};\n        if (index === this.applyTabIndexToItemAtIndex) {\n            attributes.tabindex = '0';\n        }\n\n        return (\n            <li\n                class={classNames}\n                aria-disabled={item.disabled ? 'true' : 'false'}\n                aria-selected={item.selected ? 'true' : 'false'}\n                data-index={index}\n                {...attributes}\n            >\n                {this.renderIcon(this.config, item)}\n                {this.getPrimaryComponent(item)}\n                {this.renderText(item)}\n                {this.twoLines && this.avatarList ? this.renderDivider() : null}\n                {this.renderActionMenu(item.actions)}\n            </li>\n        );\n    };\n\n    private rendertext = (item: ListSeparator) => {\n        if ('text' in item) {\n            return <h2 class=\"limel-list-divider-title\">{item.text}</h2>;\n        }\n    };\n\n    private getPrimaryComponent(item: ListItem): Element {\n        if (!this.hasPrimaryComponent(item)) {\n            return;\n        }\n\n        const PrimaryComponent = item.primaryComponent.name;\n        const props = item.primaryComponent.props;\n\n        return <PrimaryComponent {...props} />;\n    }\n\n    private hasPrimaryComponent = (item: ListItem) => {\n        return !!item?.primaryComponent?.name;\n    };\n\n    /**\n     * Render the text of the list item\n     *\n     * @param item - the list item\n     * @returns the text for the list item\n     */\n    private renderText = (item: ListItem) => {\n        if (this.isSimpleItem(item)) {\n            return (\n                <span class=\"mdc-deprecated-list-item__text\">{item.text}</span>\n            );\n        }\n\n        return (\n            <div class=\"mdc-deprecated-list-item__text\">\n                <div class=\"mdc-deprecated-list-item__primary-command-text\">\n                    <div class=\"mdc-deprecated-list-item__primary-text\">\n                        {item.text}\n                    </div>\n                </div>\n                <div class=\"mdc-deprecated-list-item__secondary-text\">\n                    {item.secondaryText}\n                </div>\n            </div>\n        );\n    };\n\n    private isSimpleItem = (item: ListItem): boolean => {\n        return !('secondaryText' in item);\n    };\n\n    /**\n     * Render an icon for a list item\n     *\n     * @param config - the config object, passed on from the `renderListItem` function\n     * @param item - the list item\n     * @returns the icon element\n     */\n    private renderIcon = (config: ListRendererConfig, item: ListItem) => {\n        const style: any = {};\n        const name = getIconName(item.icon);\n        if (!name) {\n            return;\n        }\n\n        const color = getIconColor(item.icon, item.iconColor);\n\n        if (color) {\n            if (config.badgeIcons) {\n                style['--icon-background-color'] = color;\n            } else {\n                style.color = color;\n            }\n        }\n\n        return (\n            <limel-icon\n                badge={config.badgeIcons}\n                class=\"mdc-deprecated-list-item__graphic\"\n                name={name}\n                style={style}\n                size={config.iconSize}\n            />\n        );\n    };\n\n    private renderDivider = () => {\n        const classes = {\n            'mdc-deprecated-list-divider': true,\n            'mdc-deprecated-list-divider--inset': true,\n        };\n        if (this.config.iconSize) {\n            classes[this.config.iconSize] = true;\n        }\n\n        return <hr class={classes} />;\n    };\n\n    private renderActionMenu = (actions: Array<MenuItem | ListSeparator>) => {\n        if (!actions || actions.length === 0) {\n            return;\n        }\n\n        return (\n            <limel-menu\n                class=\"mdc-deprecated-list-item__meta\"\n                items={actions}\n                openDirection=\"left-start\"\n            >\n                <limel-icon-button\n                    class=\"action-menu-trigger\"\n                    slot=\"trigger\"\n                    icon=\"menu_2\"\n                />\n            </limel-menu>\n        );\n    };\n\n    private renderVariantListItem = (\n        config: ListRendererConfig,\n        item: ListItem,\n        index: number,\n    ) => {\n        let itemTemplate;\n        if (config.type === 'radio') {\n            itemTemplate = (\n                <RadioButtonTemplate\n                    id={`c_${index}`}\n                    checked={item.selected}\n                    disabled={item.disabled}\n                />\n            );\n        } else if (config.type === 'checkbox') {\n            itemTemplate = (\n                <CheckboxTemplate\n                    id={`c_${index}`}\n                    checked={item.selected}\n                    disabled={item.disabled}\n                />\n            );\n        }\n\n        const classNames = {\n            'mdc-deprecated-list-item': true,\n            'mdc-deprecated-list-item--disabled': item.disabled,\n            'mdc-deprecated-list-item__text': !item.secondaryText,\n            'has-primary-component': this.hasPrimaryComponent(item),\n        };\n\n        const attributes: { tabindex?: string } = {};\n        if (index === this.applyTabIndexToItemAtIndex) {\n            attributes.tabindex = '0';\n        }\n\n        return (\n            <li\n                class={classNames}\n                role={config.type}\n                aria-checked={item.selected ? 'true' : 'false'}\n                aria-disabled={item.disabled ? 'true' : 'false'}\n                data-index={index}\n                {...attributes}\n            >\n                {this.renderVariantListItemContent(config, item, itemTemplate)}\n            </li>\n        );\n    };\n\n    private renderVariantListItemContent = (\n        config: ListRendererConfig,\n        item: ListItem,\n        itemTemplate: any,\n    ) => {\n        if (this.hasIcons) {\n            return [\n                item.icon ? this.renderIcon(config, item) : null,\n                this.getPrimaryComponent(item),\n                this.renderText(item),\n                <div class=\"mdc-deprecated-list-item__meta\">\n                    {itemTemplate}\n                </div>,\n            ];\n        }\n\n        return [\n            <div class=\"mdc-deprecated-list-item__graphic\">{itemTemplate}</div>,\n            this.getPrimaryComponent(item),\n            this.renderText(item),\n        ];\n    };\n}\n","@use '../../style/functions';\n@use '../../style/mixins';\n\n@use '../../style/internal/lime-theme';\n@use '../checkbox/checkbox.scss';\n\n@use '@material/list';\n\n$list-border-radius: 0.375rem; // 6px\n$list--has-interactive-items--mdc-list-item--hover: 1;\n$list-static-actions-list: 1;\n$list-mdc-list-item: 0;\n\n/**\n * @prop --icon-background-color: Color to use for icon background when `badgeIcons=true`.\n * @prop --icon-color: Color to use for icon. Defaults to grey when `badgeIcons=false`. Defaults to white when `badgeIcons=true`.\n * @prop --list-grid-max-width: Maximum width of a list that has `has-grid-layout` class. Defaults to `100%`.\n * @prop --list-grid-item-max-width: Maximum width of items in a list that has `has-grid-layout` class. Defaults to `10rem`.\n * @prop --list-grid-item-min-width: Minimum width of items in a list that has `has-grid-layout` class. Defaults to `7.5rem`.\n * @prop --list-grid-gap: Distance between items in a list that has `has-grid-layout` class. Defaults to `0.75rem`.\n * @prop --list-background-color-of-odd-interactive-items: Background color of odd list items, when `has-striped-rows` class is applied to the component. Defaults to `--contrast-200`.\n * @prop --list-background-color-of-even-interactive-items:  Background color of even list items, when `has-striped-rows` class is applied to the component. Defaults to `transparent`.\n * @prop --list-margin: Space around the list. Defaults to `0.25rem`, which visualizes keyboard-focused items in a better way, as it adds some space for the outline effect;\n */\n\n:host(limel-list) {\n    display: block;\n    isolation: isolate;\n    @include checkbox.custom-checkbox-styles;\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n@include list.deprecated-core-styles;\n\n.mdc-deprecated-list,\n.mdc-deprecated-list-item__secondary-text {\n    // As long as this component is depended on MDC,\n    // we need to force it to be font-agnostic.\n    // When MDC-dependency is removed, this block can also be removed.\n    // However, on removal of MDC-dependency, we should also make sure to check\n    // other font-related styles that might be set by MDC,\n    // such as `letter-spacing` or `font-size`.\n    font-family: inherit;\n}\n\n.mdc-deprecated-list {\n    --mdc-theme-text-icon-on-background: var(\n        --icon-color,\n        rgb(var(--contrast-900))\n    );\n    margin: var(\n        --list-margin,\n        0.25rem\n    ); // added space to visualize keyboard-focused items\n    padding: 0;\n    border-radius: $list-border-radius;\n\n    .mdc-deprecated-list-divider {\n        border-bottom-color: transparent;\n        display: flex;\n        align-items: center;\n        gap: 0.75rem;\n        height: auto;\n        padding: 0 0.5rem;\n    }\n\n    .limel-list-divider-line {\n        background-color: rgb(var(--contrast-400));\n        height: 0.125rem;\n        border-radius: 1rem;\n        min-width: 1rem;\n        flex-grow: 1;\n    }\n\n    .limel-list-divider-title {\n        all: unset;\n        @include mixins.truncate-text;\n        color: rgb(var(--contrast-900));\n        font-size: 0.8125rem; // 13px\n    }\n\n    .mdc-deprecated-list-item {\n        transition: background-color 0.2s ease;\n        box-sizing: border-box;\n        z-index: $list-mdc-list-item; // in Chrome on Windows, menus flicker when they have a scroll bar and user hovers on them. We may be able to remove this in future versions of Chrome. Kia 2021-May-12\n\n        &:not(.mdc-deprecated-list-item--disabled) {\n            &:hover {\n                background-color: rgb(var(--contrast-300));\n                z-index: 1;\n            }\n        }\n\n        &.mdc-deprecated-list-item--disabled {\n            cursor: not-allowed;\n\n            limel-icon {\n                opacity: 0.38; // similar to `mdc-deprecated-list-item__text` when disabled\n            }\n        }\n\n        &:first-child {\n            border-top-left-radius: $list-border-radius;\n            border-top-right-radius: $list-border-radius;\n        }\n        &:last-child {\n            border-bottom-right-radius: $list-border-radius;\n            border-bottom-left-radius: $list-border-radius;\n        }\n    }\n\n    &.selectable\n        .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled) {\n        cursor: pointer;\n    }\n\n    .mdc-deprecated-list-item__meta {\n        // the action menu on the right side a list item\n        line-height: 100%;\n        margin-right: -0.5rem;\n    }\n\n    .mdc-deprecated-list-item__graphic {\n        margin-right: functions.pxToRem(8);\n    }\n\n    &.mdc-deprecated-list--avatar-list {\n        position: relative;\n\n        limel-icon.mdc-deprecated-list-item__graphic {\n            background-color: var(\n                --icon-background-color,\n                rgb(var(--contrast-900))\n            );\n            color: var(--icon-color, rgba(var(--color-white), 0.88));\n            margin-right: functions.pxToRem(12);\n            margin-left: functions.pxToRem(-4);\n        }\n\n        hr.mdc-deprecated-list-divider {\n            position: absolute;\n            bottom: 0;\n\n            &.mdc-deprecated-list-divider--inset {\n                --icon-width: #{functions.pxToRem(40)};\n                --icon-right-padding: #{functions.pxToRem(12)};\n                --list-right-padding: #{functions.pxToRem(12)};\n                right: 0;\n                width: calc(\n                    100% - var(--icon-width) - var(--icon-right-padding) - var(\n                            --list-right-padding\n                        )\n                );\n\n                &.x-small {\n                    --icon-width: #{functions.pxToRem(24)};\n                }\n\n                &.small {\n                    --icon-width: #{functions.pxToRem(32)};\n                }\n\n                &.medium {\n                    --icon-width: #{functions.pxToRem(40)};\n                }\n\n                &.large {\n                    --icon-width: #{functions.pxToRem(48)};\n                }\n            }\n        }\n\n        .mdc-deprecated-list-item:last-child hr.mdc-deprecated-list-divider {\n            display: none;\n        }\n    }\n\n    &.mdc-deprecated-list--two-line {\n        .mdc-deprecated-list-item__text {\n            padding-top: functions.pxToRem(8);\n            padding-bottom: functions.pxToRem(8);\n        }\n        .mdc-deprecated-list-item__primary-text {\n            margin-bottom: functions.pxToRem(4);\n        }\n    }\n\n    .mdc-deprecated-list-item__secondary-text,\n    .mdc-deprecated-list-item__primary-text,\n    .mdc-deprecated-list-item__command-text {\n        margin: 0;\n        &:before,\n        &:after {\n            display: none;\n        }\n    }\n\n    .mdc-deprecated-list-item__command-text {\n        color: rgb(var(--contrast-800));\n        margin-left: 0.7rem;\n    }\n\n    .mdc-deprecated-list-item__text {\n        align-self: center;\n        width: 100%;\n    }\n\n    .has-primary-component {\n        .mdc-deprecated-list-item__text {\n            margin-left: 0.5rem;\n        }\n    }\n    .mdc-deprecated-list-item__primary-command-text {\n        display: flex;\n        flex-direction: row;\n        justify-content: space-between;\n        align-items: baseline;\n    }\n\n    // Tweaks to display the icon correctly in Edge\n    limel-icon.mdc-deprecated-list-item__graphic {\n        display: block;\n    }\n}\n\n.mdc-deprecated-list:not(.mdc-deprecated-list--avatar-list) {\n    limel-icon.mdc-deprecated-list-item__graphic {\n        // Tweaks to make icon lists align nicely with badge-icon lists.\n        &[size='x-small'] {\n            margin-right: functions.pxToRem(4);\n        }\n        &[size='small'] {\n            margin-right: functions.pxToRem(8);\n        }\n        &[size='medium'] {\n            margin-right: functions.pxToRem(8);\n        }\n        &[size='large'] {\n            margin-right: functions.pxToRem(12);\n        }\n    }\n}\n\n.mdc-deprecated-list-item.mdc-deprecated-list-item--selected {\n    &:before {\n        background-color: var(--mdc-theme-primary);\n        opacity: 0.15;\n    }\n}\n\n:not(.mdc-deprecated-list--non-interactive) {\n    > {\n        :not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item {\n            @include mixins.visualize-keyboard-focus;\n\n            &:focus-visible {\n                border-radius: $list-border-radius;\n                z-index: $list--has-interactive-items--mdc-list-item--hover;\n            }\n        }\n    }\n}\n\n@import '../checkbox/checkbox.scss';\n\n@import './radio-button/radio-button.scss';\n\n@import './partial-styles/custom-styles.scss';\n@import './partial-styles/enable-multiline-text.scss';\n@import './partial-styles/_has-grid-layout.scss';\n@import './partial-styles/_static-actions.scss';\n","import { IconSize } from '../icon/icon.types';\nimport { ListItem, ListSeparator } from './list-item.types';\nimport { ListType } from './list.types';\nimport { MDCList, MDCListActionEvent } from '@material/list';\nimport { strings as listStrings } from '@material/list/constants';\nimport {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    Watch,\n} from '@stencil/core';\nimport { ListRenderer } from './list-renderer';\nimport { ListRendererConfig } from './list-renderer-config';\n\nconst { ACTION_EVENT } = listStrings;\n\n/**\n * @exampleComponent limel-example-list\n * @exampleComponent limel-example-list-secondary\n * @exampleComponent limel-example-list-separator\n * @exampleComponent limel-example-list-selectable\n * @exampleComponent limel-example-list-icons\n * @exampleComponent limel-example-list-badge-icons\n * @exampleComponent limel-example-list-checkbox\n * @exampleComponent limel-example-list-checkbox-icons\n * @exampleComponent limel-example-list-radio-button\n * @exampleComponent limel-example-list-radio-button-icons\n * @exampleComponent limel-example-list-action\n * @exampleComponent limel-example-list-striped\n * @exampleComponent limel-example-list-badge-icons-with-multiple-lines\n * @exampleComponent limel-example-list-grid\n * @exampleComponent limel-example-list-primary-component\n */\n@Component({\n    tag: 'limel-list',\n    shadow: true,\n    styleUrl: 'list.scss',\n})\nexport class List {\n    /**\n     * List of items to display\n     */\n    @Prop()\n    public items: Array<ListItem | ListSeparator>;\n\n    /**\n     * Set to `true` if the list should display larger icons with a background\n     */\n    @Prop()\n    public badgeIcons: boolean;\n\n    /**\n     * Size of the icons in the list\n     */\n    @Prop()\n    public iconSize: IconSize = 'small';\n\n    /**\n     * The type of the list, omit to get a regular list. Available types are:\n     * `selectable`: regular list with single selection.\n     * `radio`: radio button list with single selection.\n     * `checkbox`: checkbox list with multiple selection.\n     */\n    @Prop()\n    public type: ListType;\n\n    /**\n     * By default, lists will display 3 lines of text, and then truncate the rest.\n     * Consumers can increase or decrease this number by specifying\n     * `maxLinesSecondaryText`. If consumer enters zero or negative\n     * numbers we default to 1; and if they type decimals we round up.\n     */\n    // eslint-disable-next-line no-magic-numbers\n    @Prop() maxLinesSecondaryText: number = 3;\n\n    @Element()\n    private element: HTMLLimelListElement;\n\n    private config: ListRendererConfig;\n    private listRenderer = new ListRenderer();\n    private mdcList: MDCList;\n    private multiple: boolean;\n    private selectable: boolean;\n\n    /**\n     * Fired when a new value has been selected from the list.\n     * Only fired if `type` is set to `selectable`, `radio` or `checkbox`.\n     */\n    @Event()\n    private change: EventEmitter<ListItem | ListItem[]>;\n\n    /**\n     * Fired when an action has been selected from the action menu of a list item\n     */\n    @Event()\n    protected select: EventEmitter<ListItem | ListItem[]>;\n\n    public connectedCallback() {\n        this.setup();\n    }\n\n    public disconnectedCallback() {\n        this.teardown();\n    }\n\n    public componentDidLoad() {\n        this.setup();\n        this.triggerIconColorWarning();\n    }\n\n    public render() {\n        this.config = {\n            badgeIcons: this.badgeIcons,\n            type: this.type,\n            iconSize: this.iconSize,\n        };\n        let maxLinesSecondaryText = +this.maxLinesSecondaryText?.toFixed();\n        if (this.maxLinesSecondaryText < 1) {\n            maxLinesSecondaryText = 1;\n        }\n\n        const html = this.listRenderer.render(this.items, this.config);\n\n        return (\n            <Host\n                style={{\n                    '--maxLinesSecondaryText': `${maxLinesSecondaryText}`,\n                }}\n            >\n                {html}\n            </Host>\n        );\n    }\n\n    @Watch('type')\n    protected handleType() {\n        this.setupListeners();\n    }\n\n    @Watch('items')\n    protected itemsChanged() {\n        if (!this.mdcList) {\n            return;\n        }\n\n        setTimeout(() => {\n            this.setup();\n\n            const listItems = this.items.filter(this.isListItem);\n\n            if (this.multiple) {\n                this.mdcList.selectedIndex = listItems\n                    .filter((item: ListItem) => item.selected)\n                    .map((item: ListItem) => listItems.indexOf(item));\n            } else {\n                const selectedIndex = listItems.findIndex(\n                    (item: ListItem) => item.selected,\n                );\n\n                if (selectedIndex === -1) {\n                    this.mdcList.initializeListType();\n                } else {\n                    this.mdcList.selectedIndex = selectedIndex;\n                }\n            }\n        }, 0);\n    }\n\n    private setup = () => {\n        this.setupList();\n\n        this.setupListeners();\n    };\n\n    private setupList = () => {\n        if (this.mdcList) {\n            this.teardown();\n            this.mdcList = null;\n        }\n\n        const element = this.element.shadowRoot.querySelector(\n            '.mdc-deprecated-list',\n        );\n        if (!element) {\n            return;\n        }\n\n        this.mdcList = new MDCList(element);\n        this.mdcList.hasTypeahead = true;\n    };\n\n    private setupListeners = () => {\n        if (!this.mdcList) {\n            return;\n        }\n\n        this.mdcList.unlisten(ACTION_EVENT, this.handleAction);\n\n        this.selectable = ['selectable', 'radio', 'checkbox'].includes(\n            this.type,\n        );\n        this.multiple = this.type === 'checkbox';\n\n        if (!this.selectable) {\n            return;\n        }\n\n        this.mdcList.listen(ACTION_EVENT, this.handleAction);\n        this.mdcList.singleSelection = !this.multiple;\n    };\n\n    private teardown = () => {\n        this.mdcList?.unlisten(ACTION_EVENT, this.handleAction);\n        this.mdcList?.destroy();\n    };\n\n    private handleAction = (event: MDCListActionEvent) => {\n        if (!this.multiple) {\n            this.handleSingleSelect(event.detail.index);\n\n            return;\n        }\n\n        this.handleMultiSelect(event.detail.index);\n    };\n\n    private handleSingleSelect = (index: number) => {\n        const listItems = this.items.filter(this.isListItem) as ListItem[];\n        if (listItems[index].disabled) {\n            return;\n        }\n\n        const selectedItem: ListItem = listItems.find((item: ListItem) => {\n            return !!item.selected;\n        });\n\n        if (selectedItem) {\n            this.change.emit({ ...selectedItem, selected: false });\n        }\n\n        if (listItems[index] !== selectedItem) {\n            this.change.emit({ ...listItems[index], selected: true });\n        }\n    };\n\n    private handleMultiSelect = (index: number) => {\n        const listItems = this.items.filter(this.isListItem) as ListItem[];\n        if (listItems[index].disabled) {\n            return;\n        }\n\n        const selectedItems: ListItem[] = listItems\n            .filter((item: ListItem, listIndex: number) => {\n                if (listIndex === index) {\n                    // This is the item that was selected or deselected,\n                    // so we negate its previous selection status.\n                    return !item.selected;\n                }\n\n                // This is an item that didn't change, so we keep its selection status.\n                return item.selected;\n            })\n            .map((item: ListItem) => {\n                return { ...item, selected: true };\n            });\n\n        this.change.emit(selectedItems);\n    };\n\n    private isListItem = (item: ListItem): boolean => {\n        return !('separator' in item);\n    };\n\n    private triggerIconColorWarning() {\n        if (this.items.some((item) => 'iconColor' in item)) {\n            /* eslint-disable-next-line no-console */\n            console.warn(\n                \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n            );\n        }\n    }\n}\n","@use '@material/menu-surface';\n@use '@material/elevation';\n@use '@material/menu';\n\n/**\n* @prop --limel-menu-surface-display: defines whether the surface is treated as a block, flex or grid. It affects layout used to display its children. Defaults to `block`.\n* @prop --limel-menu-surface-flex-direction: defines the direction of menu-surface layout.\n*/\n\n:host(limel-menu-surface) {\n    display: block;\n    max-height: inherit;\n}\n\n@include menu-surface.core-styles;\n@include menu.core-styles;\n\n.mdc-menu-surface {\n    display: var(--limel-menu-surface-display, block);\n    flex-direction: var(--limel-menu-surface-flex-direction, row);\n    max-height: inherit;\n    position: relative;\n    --mdc-menu-max-width: var(\n        --menu-surface-width,\n        min(calc(100vw - 2rem), 20rem)\n    );\n    background-color: var(--lime-elevated-surface-background-color);\n}\n\n:host(limel-menu-surface.has-grid-layout) {\n    .mdc-menu-surface {\n        width: var(--menu-surface-width, min(calc(100vw - 2rem), 40rem));\n        max-width: unset;\n    }\n}\n","import { Corner, MDCMenuSurface } from '@material/menu-surface';\nimport {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n} from '@stencil/core';\nimport { isDescendant } from '../../util/dom';\nimport {\n    ESCAPE,\n    ESCAPE_KEY_CODE,\n    TAB,\n    TAB_KEY_CODE,\n} from '../../util/keycodes';\n\n/**\n * @slot - Content to put inside the surface\n * @private\n */\n@Component({\n    tag: 'limel-menu-surface',\n    shadow: true,\n    styleUrl: 'menu-surface.scss',\n})\nexport class MenuSurface {\n    /**\n     * True if the menu surface is open, false otherwise\n     */\n    @Prop()\n    public open = false;\n\n    /**\n     * Clicks in this element should not be prevented when the menu surface is open\n     */\n    @Prop()\n    public allowClicksElement: HTMLElement;\n\n    /**\n     * Emitted when the menu surface is dismissed and should be closed\n     */\n    @Event()\n    public dismiss: EventEmitter<void>;\n\n    @Element()\n    private host: HTMLLimelMenuSurfaceElement;\n\n    private menuSurface: MDCMenuSurface;\n\n    public connectedCallback() {\n        this.setup();\n    }\n\n    public disconnectedCallback() {\n        this.teardown();\n    }\n\n    public componentDidLoad() {\n        this.setup();\n    }\n\n    public render() {\n        const classList = {\n            'mdc-menu': true,\n            'mdc-menu-surface': true,\n            'mdc-menu-surface--open': this.open,\n            'mdc-elevation-transition': true,\n            'mdc-elevation--z4': true,\n        };\n\n        return (\n            <div class={classList} tabindex=\"-1\">\n                <slot />\n            </div>\n        );\n    }\n\n    private setup = () => {\n        const menuElement: HTMLElement =\n            this.host.shadowRoot.querySelector('.mdc-menu-surface');\n        if (!menuElement) {\n            return;\n        }\n\n        this.menuSurface = new MDCMenuSurface(menuElement);\n        this.menuSurface.setAnchorCorner(Corner.TOP_START);\n\n        document.addEventListener('mousedown', this.handleDocumentClick, {\n            capture: true,\n        });\n        this.host.addEventListener('keydown', this.handleKeyDown);\n        window.addEventListener('resize', this.handleResize, {\n            passive: true,\n        });\n    };\n\n    private teardown = () => {\n        this.menuSurface?.destroy();\n        document.removeEventListener('mousedown', this.handleDocumentClick, {\n            capture: true,\n        });\n        this.host.removeEventListener('keydown', this.handleKeyDown);\n        window.removeEventListener('resize', this.handleResize);\n    };\n\n    private handleDocumentClick = (event) => {\n        const elementPath = event.composedPath ? event.composedPath() : [];\n\n        if (!this.open) {\n            return;\n        }\n\n        if (isDescendant(event.target, this.host)) {\n            return;\n        }\n\n        if (this.allowClicksElement) {\n            const clickedInAllowedElement = elementPath.includes(\n                this.allowClicksElement,\n            );\n\n            if (clickedInAllowedElement) {\n                return;\n            }\n        }\n\n        this.dismiss.emit();\n        this.preventClickEventPropagation();\n    };\n\n    private handleResize = () => {\n        if (this.open) {\n            this.dismiss.emit();\n        }\n    };\n\n    private preventClickEventPropagation = () => {\n        // When the menu surface is open, we want to stop the `click` event from propagating\n        // when clicking outside the surface itself. This is to prevent any dialog that might\n        // be open from closing, etc. However, when dragging a scrollbar no `click` event is emitted,\n        // only mousedown and mouseup. So we listen for `mousedown` and attach a one-time listener\n        // for `click`, so we can capture and \"kill\" it.\n        document.addEventListener('click', this.stopEvent, {\n            capture: true,\n            once: true,\n        });\n        // We also capture and \"kill\" the next `mouseup` event.\n        document.addEventListener('mouseup', this.stopEvent, {\n            capture: true,\n            once: true,\n        });\n        // If the user dragged the scrollbar, no `click` event happens. So when we get the\n        // `mouseup` event, remove the handler for `click` if it's still there.\n        // Otherwise, we would catch the next click even though the menu is no longer open.\n        document.addEventListener(\n            'mouseup',\n            () => {\n                document.removeEventListener('click', this.stopEvent, {\n                    capture: true,\n                });\n            },\n            {\n                once: true,\n            },\n        );\n    };\n\n    private stopEvent = (event) => {\n        event.stopPropagation();\n        event.preventDefault();\n    };\n\n    private handleKeyDown = (event: KeyboardEvent) => {\n        const isEscape =\n            event.key === ESCAPE || event.keyCode === ESCAPE_KEY_CODE;\n        const isTab = event.key === TAB || event.keyCode === TAB_KEY_CODE;\n\n        if (this.open && (isEscape || isTab)) {\n            event.stopPropagation();\n            this.dismiss.emit();\n        }\n    };\n}\n"],"mappings":"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"}

package/dist/lime-elements/p-3480e5ff.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as o,H as r}from"./p-3075aa67.js";const i='@charset "UTF-8";:host(limel-split-button.has-menu){--button-padding-right:2rem}:host(limel-split-button){display:inline-flex;isolation:isolate}:host(limel-split-button) *{box-sizing:border-box}:host([disabled]){pointer-events:none}limel-button{width:100%}limel-menu{display:flex;justify-content:flex-end;position:relative;z-index:1;padding:0.125rem;margin-left:calc(var(--button-padding-right) * -1);width:var(--button-padding-right)}limel-menu:before{transition:background-color 0.5s ease;content:"";position:absolute;inset:0.375rem auto 0.375rem 0.6875rem;width:1px;background-color:currentColor;opacity:0.2}limel-menu:not([disabled]){color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}limel-menu:not([disabled]).primary{color:var(--mdc-theme-on-primary, rgb(var(--color-white)))}limel-menu[disabled]{color:rgba(var(--contrast-1600), 0.37)}limel-menu:hover:before,limel-menu:focus-within:before{background-color:transparent}.menu-trigger{all:unset;text-align:center;font-weight:bold;border-radius:0.125rem;height:100%;width:1rem}.menu-trigger:not(:disabled){transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:"inherit";background-color:transparent;cursor:pointer}.menu-trigger:not(:disabled):hover{color:"inherit";background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}.menu-trigger:not(:disabled):active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.menu-trigger:not(:disabled):focus{outline:none}.menu-trigger:not(:disabled):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.menu-trigger:not(:disabled):focus-visible,.menu-trigger:not(:disabled):hover{background-color:rgb(var(--color-white), 0.1)}.menu-trigger:before{content:"";position:absolute;inset:-0.25rem;z-index:-1}';const n=class{constructor(r){e(this,r);this.select=t(this,"select",7);this.renderMenu=()=>{if(!this.items.length){return}return o("limel-menu",{class:{primary:this.primary},disabled:this.disabled,items:this.items,openDirection:"bottom"},o("button",{class:"menu-trigger",slot:"trigger",disabled:this.disabled},"⋮"))};this.label=undefined;this.primary=false;this.icon=undefined;this.disabled=false;this.items=[]}render(){return o(r,{class:{"has-menu":!!this.items.length}},o("limel-button",{label:this.label,primary:this.primary,icon:this.icon,disabled:this.disabled}),this.renderMenu())}};n.style=i;export{n as limel_split_button};
-//# sourceMappingURL=p-3480e5ff.entry.js.map

package/dist/lime-elements/p-3480e5ff.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["splitButtonCss","SplitButton","this","renderMenu","items","length","h","class","primary","disabled","openDirection","slot","render","Host","label","icon"],"sources":["./src/components/split-button/split-button.scss?tag=limel-split-button&encapsulation=shadow","./src/components/split-button/split-button.tsx"],"sourcesContent":["@import '../../style/mixins';\n\n:host(limel-split-button.has-menu) {\n    --button-padding-right: 2rem;\n}\n\n:host(limel-split-button) {\n    display: inline-flex;\n    isolation: isolate;\n\n    * {\n        box-sizing: border-box;\n    }\n}\n\n:host([disabled]) {\n    pointer-events: none;\n}\n\nlimel-button {\n    width: 100%;\n}\n\n$distance-around-trigger: 0.125rem;\n\nlimel-menu {\n    display: flex;\n    justify-content: flex-end;\n    position: relative;\n    z-index: 1;\n\n    padding: $distance-around-trigger;\n    margin-left: calc(var(--button-padding-right) * -1);\n    width: var(--button-padding-right);\n\n    &:before {\n        transition: background-color 0.5s ease;\n        content: '';\n        position: absolute;\n        inset: 0.375rem auto 0.375rem 0.6875rem;\n        width: 1px;\n        background-color: currentColor;\n\n        opacity: 0.2;\n    }\n\n    &:not([disabled]) {\n        color: var(\n            --mdc-theme-primary,\n            rgb(var(--color-teal-default))\n        ); // similar to limel-button text\n\n        &.primary {\n            color: var(\n                --mdc-theme-on-primary,\n                rgb(var(--color-white))\n            ); // similar to limel-button text\n        }\n    }\n\n    &[disabled] {\n        color: rgba(var(--contrast-1600), 0.37); // similar to limel-button text\n    }\n\n    &:hover,\n    &:focus-within {\n        &:before {\n            background-color: transparent;\n        }\n    }\n}\n\n.menu-trigger {\n    all: unset;\n\n    text-align: center;\n    font-weight: bold;\n\n    border-radius: 0.125rem;\n    height: 100%;\n    width: 1rem;\n\n    &:not(:disabled) {\n        @include is-flat-clickable(\n            $color: 'inherit',\n            $color--hovered: 'inherit'\n        );\n        @include visualize-keyboard-focus();\n        cursor: pointer;\n\n        &:focus-visible,\n        &:hover {\n            background-color: rgb(var(--color-white), 0.1);\n        }\n    }\n\n    &:before {\n        // prevents unintentionally activating the default action,\n        // by clicking on the edge of menu trigger,\n        // which would be activating the default onClick action\n        // on `limel-button`.\n        content: '';\n        position: absolute;\n        inset: -$distance-around-trigger * 2;\n        z-index: -1;\n    }\n}\n","import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { ListSeparator } from '../list/list-item.types';\nimport { MenuItem } from '../menu/menu.types';\n\n/**\n * A split button is a button with two components:\n * a button and a side-menu attached to it.\n *\n * Clicking on the button runs a default action,\n * and clicking on the arrow opens up a list of other possible actions.\n *\n * :::warning\n * - Never use a split button for navigation purposes, such as going to next page.\n * The button should only be used for performing commands!\n * - Never use this component instead of a Select or Menu component!\n * :::\n *\n * @exampleComponent limel-example-split-button-basic\n * @exampleComponent limel-example-split-button-repeat-default-command\n */\n@Component({\n    tag: 'limel-split-button',\n    styleUrl: 'split-button.scss',\n    shadow: true,\n})\nexport class SplitButton {\n    /**\n     * The text to show on the default action part of the button.\n     */\n    @Prop({ reflect: true })\n    public label: string;\n\n    /**\n     * Set to `true` to make the button primary.\n     */\n    @Prop({ reflect: true })\n    public primary = false;\n\n    /**\n     * Set icon for the button\n     */\n    @Prop({ reflect: true })\n    public icon: string;\n\n    /**\n     * Set to `true` to disable the button.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    /**\n     * A list of items and separators to show in the menu.\n     */\n    @Prop()\n    public items: Array<MenuItem | ListSeparator> = [];\n\n    /**\n     * Is emitted when a menu item is selected.\n     */\n    @Event()\n    public select: EventEmitter<MenuItem>;\n\n    render() {\n        return (\n            <Host\n                class={{\n                    'has-menu': !!this.items.length,\n                }}\n            >\n                <limel-button\n                    label={this.label}\n                    primary={this.primary}\n                    icon={this.icon}\n                    disabled={this.disabled}\n                />\n                {this.renderMenu()}\n            </Host>\n        );\n    }\n\n    private renderMenu = () => {\n        if (!this.items.length) {\n            return;\n        }\n\n        return (\n            <limel-menu\n                class={{\n                    primary: this.primary,\n                }}\n                disabled={this.disabled}\n                items={this.items}\n                openDirection=\"bottom\"\n            >\n                <button\n                    class=\"menu-trigger\"\n                    slot=\"trigger\"\n                    disabled={this.disabled}\n                >\n                    ⋮\n                </button>\n            </limel-menu>\n        );\n    };\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,y0D,MCyBVC,EAAW,M,wDAuDZC,KAAAC,WAAa,KACjB,IAAKD,KAAKE,MAAMC,OAAQ,CACpB,M,CAGJ,OACIC,EAAA,cACIC,MAAO,CACHC,QAASN,KAAKM,SAElBC,SAAUP,KAAKO,SACfL,MAAOF,KAAKE,MACZM,cAAc,UAEdJ,EAAA,UACIC,MAAM,eACNI,KAAK,UACLF,SAAUP,KAAKO,UAAQ,KAIlB,E,kCAjEJ,M,kCAYC,M,WAM8B,E,CAQhDG,SACI,OACIN,EAACO,EAAI,CACDN,MAAO,CACH,aAAcL,KAAKE,MAAMC,SAG7BC,EAAA,gBACIQ,MAAOZ,KAAKY,MACZN,QAASN,KAAKM,QACdO,KAAMb,KAAKa,KACXN,SAAUP,KAAKO,WAElBP,KAAKC,a"}

package/dist/lime-elements/p-60deff40.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["breadcrumbsCss","Breadcrumbs","this","renderSteps","allStepsWithoutLast","items","slice","areItemsLinks","map","renderAsLink","renderAsButton","item","tooltipId","createRandomString","h","role","id","class","onClick","handleClick","renderIcon","renderLabel","renderTooltip","href","link","title","renderLastStep","lastItem","tabindex","text","name","getIconName","icon","color","getIconColor","style","type","elementId","label","some","event","stopPropagation","select","emit","render","divider","componentWillLoad","makeEnterClickable","host","disconnectedCallback","removeEnterClickable","menuCss","SEARCH_DEBOUNCE","Menu","constructor","hostRef","renderLoader","loadingSubItems","loading","cssProperties","getCssProperties","width","display","padding","size","limeBranded","renderBreadcrumb","_a","menuBreadCrumb","length","onSelect","handleBreadcrumbsSelect","detail","menuItem","currentSubMenu","clearSearch","navigateMenu","setFocus","handleSelect","renderSearchField","searcher","ref","setSearchElement","leadingIcon","value","searchValue","onChange","handleTextInput","onKeyDown","handleInputKeyDown","renderEmptyMessage","emptyResultMessage","Array","isArray","searchResults","renderMenuList","visibleItems","gridLayout","badgeIcons","setListElement","handleMenuKeyDown","async","query","result","debouncedSearch","isForwardTab","key","TAB","keyCode","TAB_KEY_CODE","altKey","metaKey","shiftKey","isUp","ARROW_UP","ARROW_UP_KEY_CODE","isDown","ARROW_DOWN","ARROW_DOWN_KEY_CODE","list","preventDefault","listItems","shadowRoot","querySelectorAll","listElement","focus","isBackwardTab","isLeft","ARROW_LEFT","ARROW_LEFT_KEY_CODE","isRight","ARROW_RIGHT","ARROW_RIGHT_KEY_CODE","searchInput","currentItem","getCurrentItem","goForward","goBack","activeItem","_b","querySelector","attrIndex","_c","attributes","getNamedItem","dataIndex","parseInt","parent","parentItem","setTriggerAttributes","element","open","disabled","Object","entries","removeAttribute","setAttribute","String","onClose","cancel","onTriggerClick","selectOnEmptyChildren","isFunction","menuLoader","subItems","setTimeout","observer","IntersectionObserver","unobserve","window","document","activeElement","observe","focusMenuItem","blur","menuItems","filter","isMenuItem","selectedIndex","Math","max","findIndex","selected","menuElements","from","renderNotificationBadge","hasNotificationBadge","badge","undefined","setTriggerRef","elm","triggerElement","createDebouncedSearcher","bind","portalId","componentDidLoad","componentDidRender","slotElement","assignedElements","forEach","dropdownZIndex","getComputedStyle","getPropertyValue","menuSurfaceWidth","getMenuSurfaceWidth","visible","containerId","openDirection","position","containerStyle","onDismiss","assign","itemsWatcher","openWatcher","newValue","currentSubMenuWatcher","breadCrumbItems","push","reverse","AwesomeDebouncePromise","propertyNames","values","property","zipObject","customWidth","surfaceWidth","assignedTriggers","clientWidth","_d","cssClasses","MENU_SELECTED_LIST_ITEM","MENU_SELECTION_GROUP","ROOT","strings","ARIA_CHECKED_ATTR","ARIA_DISABLED_ATTR","CHECKBOX_SELECTOR","LIST_SELECTOR","SELECTED_EVENT","SKIP_RESTORE_FOCUS","numbers","FOCUS_ROOT_INDEX","DefaultFocusState","MDCMenuFoundation","_super","__extends","adapter","_this","call","__assign","defaultAdapter","closeAnimationEndTimerId","defaultFocusState","LIST_ROOT","defineProperty","get","enumerable","configurable","addClassToElementAtIndex","removeClassFromElementAtIndex","addAttributeToElementAtIndex","removeAttributeFromElementAtIndex","getAttributeFromElementAtIndex","elementContainsClass","closeSurface","getElementIndex","notifySelected","getMenuItemCount","focusItemAtIndex","focusListRoot","getSelectedSiblingOfItemAtIndex","isSelectableItemAtIndex","prototype","destroy","clearTimeout","handleKeydown","evt","isTab","handleItemAction","listItem","index","skipRestoreFocus","recomputedIndex","setSelectedIndex","MDCMenuSurfaceFoundation","TRANSITION_CLOSE_DURATION","handleMenuSurfaceOpened","FIRST_ITEM","LAST_ITEM","NONE","setDefaultFocusState","focusState","getSelectedIndex","validatedIndex","Error","prevSelectedIndex","setEnabled","isEnabled","listCssClasses","LIST_ITEM_DISABLED_CLASS","menuSize","isIndexInRange","MDCFoundation","MDCMenu","apply","arguments","attachTo","root","initialize","menuSurfaceFactory","listFactory","el","MDCMenuSurface","MDCList","initialSyncWithDOM","menuSurface","wrapFocus","foundation","listen","OPENED_EVENT","MDCListFoundation","ACTION_EVENT","unlisten","isOpen","set","close","hasTypeahead","typeaheadInProgress","typeaheadMatchItem","nextChar","startingIndex","layout","listElements","singleSelection","listConstants","UNSET_INDEX","quickOpen","setAnchorCorner","corner","setAnchorMargin","margin","getOptionByIndex","getPrimaryTextAtIndex","getPrimaryText","setFixedPosition","isFixed","setIsHoisted","isHoisted","setAbsolutePosition","x","y","setAnchorElement","anchorElement","getDefaultFoundation","className","classList","add","remove","attr","getAttribute","contains","indexOf","evtData","closest","selectionGroupEl","selectedItemEl","MDCComponent","MenuListRenderer","defaultConfig","getIndexForWhichToApplyTabIndex","i","renderMenuItem","rendertext","classNames","applyTabIndexToItemAtIndex","config","renderText","renderSubMenuIcon","renderNotification","twoLines","avatarList","renderDivider","isSimpleItem","renderCommandText","secondaryText","hasSubItems","commandText","iconColor","iconSize","classes","commandKey","hasIcons","selectable","includes","menuListCss","menuStrings","MenuList","setup","setupMenu","setupListeners","mdcMenu","teardown","MDCRipple","handleMenuSelect","handleSingleSelect","MenuItems","selectedItem","find","connectedCallback","triggerIconColorWarning","html","handleType","itemsChanged","console","warn"],"sources":["./src/components/breadcrumbs/breadcrumbs.scss?tag=limel-breadcrumbs&encapsulation=shadow","./src/components/breadcrumbs/breadcrumbs.tsx","./src/components/menu/menu.scss?tag=limel-menu&encapsulation=shadow","./src/components/menu/menu.tsx","./node_modules/@material/menu/constants.js","./node_modules/@material/menu/foundation.js","./node_modules/@material/menu/component.js","./src/components/menu-list/menu-list-renderer.tsx","./src/components/menu-list/menu-list.scss?tag=limel-menu-list&encapsulation=shadow","./src/components/menu-list/menu-list.tsx"],"sourcesContent":["@use '../../style/mixins';\n\n/**\n* @prop --breadcrumbs-item-text-color: Text color of breadcrumbs items, defaults to `--contrast-1100`.\n* @prop --breadcrumbs-item-max-width: Maximum width of a button in the breadcrumbs. Defaults to `10rem`. Keep in mind that the buttons should not appear too big.\n*/\n\n$padding: 0.5rem;\n\n:host(limel-breadcrumbs) {\n    --limel-breadcrumbs-item-height: 1.5rem;\n    --limel-breadcrumbs-gap: 0.75rem;\n    --limel-breadcrumbs-gap: 0.75rem;\n    --limel-breadcrumbs-item-text-color: var(\n        --breadcrumbs-item-text-color,\n        rgb(var(--contrast-1500))\n    );\n    @include mixins.fade-out-overflowed-content-on-edges(horizontally);\n    --limel-left-edge-fade-width: #{$padding};\n    --limel-right-edge-fade-width: #{$padding};\n}\n\nol,\nli,\n.step {\n    all: unset;\n}\n\n* {\n    box-sizing: border-box;\n}\n\nol {\n    padding: $padding; // needed for the focus and hover effects, since we are using overflow\n    gap: var(--limel-breadcrumbs-gap);\n}\n\n.step {\n    position: relative;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 0.25rem;\n\n    max-width: var(--breadcrumbs-item-max-width, 10rem);\n    height: var(--limel-breadcrumbs-item-height);\n\n    color: var(--limel-breadcrumbs-item-text-color);\n    border-radius: 100vw;\n    font-size: 0.875rem;\n    padding: 0 0.25rem;\n\n    &:not(:has(.text)) {\n        padding: 0 0.125rem;\n    }\n\n    &:not(.last) {\n        @include mixins.visualize-keyboard-focus;\n\n        &:after {\n            content: var(--limel-breadcrumbs-divider);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n\n            width: var(--limel-breadcrumbs-gap);\n\n            position: absolute;\n            top: 0;\n            right: calc(var(--limel-breadcrumbs-gap) * -1);\n            bottom: 0;\n            left: auto;\n\n            text-align: center;\n        }\n    }\n}\n\na.step {\n    @include mixins.hyperlink($color: var(--limel-breadcrumbs-item-text-color));\n}\n\nbutton.step {\n    &:not(.last) {\n        @include mixins.is-flat-clickable(\n            $color: var(--limel-breadcrumbs-item-text-color)\n        );\n    }\n}\n\nlimel-icon {\n    flex-shrink: 0;\n    width: calc(var(--limel-breadcrumbs-item-height) - 0.25rem);\n    height: calc(var(--limel-breadcrumbs-item-height) - 0.25rem);\n}\n\n.text {\n    @include mixins.truncate-text;\n    padding: 0 0.25rem;\n}\n\n.last {\n    opacity: 0.7;\n}\n\n// LAYOUT:\n// The code below makes sure that the last item is always visible,\n// and previous items overflow out of the container\n// while keeping the container scrollable.\n// All without any additional scripts in the component code.\n\n:host(limel-breadcrumbs) {\n    box-sizing: border-box;\n\n    display: flex;\n    width: 100%;\n    overflow-x: auto;\n    scrollbar-width: none; // This hides the scrollbars appearing under in Firefox\n    -ms-overflow-style: none; // Same as above for IE 11\n    &::-webkit-scrollbar {\n        display: none; // This hides the scrollbars appearing under in Chrome\n    }\n\n    direction: rtl;\n}\n\nol {\n    display: flex;\n    flex-direction: row-reverse;\n    justify-content: flex-end;\n    margin-right: auto;\n}\n\n.step {\n    direction: ltr;\n}\n","import {\n    Component,\n    Element,\n    h,\n    Event,\n    EventEmitter,\n    Prop,\n} from '@stencil/core';\nimport { BreadcrumbsItem } from './breadcrumbs.types';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../util/make-enter-clickable';\nimport { createRandomString } from '../../util/random-string';\nimport { getIconColor, getIconName } from '../icon/get-icon-props';\n\n/**\n * A Breadcrumb consists of a list of distinct \"places\" that a user has gone through,\n * before ending up where they are right now, in a website or an application.\n *\n * These \"places\" can be for example _pages_ of a website, which are hierarchically\n * laid out before the current page that the user is looking at.\n * They could also be _steps_ which the user has gone through, which perhaps have no\n * hierarchical relation with each other, but has eventually led the user \"here\".\n *\n * :::note\n * - Where the user currently is, is always the last step of the breadcrumb.\n * - A breadcrumbs never shows where users can go after this place.\n * It only illustrates where user has been before ending up here.\n * If the path that a user can take is not changing and if next steps are clear,\n * you can use the [Progress flow component](#/component/limel-progress-flow) instead.\n * :::\n *\n * Breadcrumbs are often placed horizontally before the main content of the current screen.\n *\n * @exampleComponent limel-example-breadcrumbs-links\n * @exampleComponent limel-example-breadcrumbs-buttons\n * @exampleComponent limel-example-breadcrumbs-icons\n * @exampleComponent limel-example-breadcrumbs-divider\n * @exampleComponent limel-example-breadcrumbs-icon-color\n * @exampleComponent limel-example-breadcrumbs-styling\n */\n\n@Component({\n    tag: 'limel-breadcrumbs',\n    shadow: true,\n    styleUrl: 'breadcrumbs.scss',\n})\nexport class Breadcrumbs {\n    /**\n     * List of items in the breadcrumbs,\n     * each representing a step or a page.\n     */\n    @Prop()\n    public items: BreadcrumbsItem[];\n\n    /**\n     * The visual divider that separates items.\n     * It must be a single character such as `-` or `,`.\n     */\n    @Prop()\n    public divider: string = '›';\n\n    /**\n     * Fired when clicking on buttons (not links!)\n     * inside the breadcrumbs.\n     */\n    @Event()\n    public select: EventEmitter<BreadcrumbsItem>;\n\n    @Element()\n    private host: HTMLLimelBreadcrumbsElement;\n\n    public render() {\n        return (\n            <ol\n                role=\"navigation\"\n                aria-label=\"Breadcrumb\"\n                style={{ '--limel-breadcrumbs-divider': `'${this.divider}'` }}\n            >\n                {this.renderSteps()}\n                {this.renderLastStep()}\n            </ol>\n        );\n    }\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    private renderSteps = () => {\n        const allStepsWithoutLast = this.items.slice(0, -1);\n\n        if (this.areItemsLinks(this.items)) {\n            return allStepsWithoutLast.map(this.renderAsLink);\n        }\n\n        return allStepsWithoutLast.map(this.renderAsButton);\n    };\n\n    private renderAsButton = (item: BreadcrumbsItem) => {\n        const tooltipId = createRandomString();\n\n        return [\n            <button\n                role=\"listitem\"\n                id={tooltipId}\n                class=\"step\"\n                onClick={this.handleClick(item)}\n            >\n                {this.renderIcon(item)}\n                {this.renderLabel(item)}\n            </button>,\n            this.renderTooltip(item, tooltipId),\n        ];\n    };\n\n    private renderAsLink = (item: BreadcrumbsItem) => {\n        const tooltipId = createRandomString();\n\n        return [\n            <a\n                role=\"listitem\"\n                id={createRandomString()}\n                class=\"step\"\n                href={item.link.href}\n                title={item.link.title}\n            >\n                {this.renderIcon(item)}\n                {this.renderLabel(item)}\n            </a>,\n            this.renderTooltip(item, tooltipId),\n        ];\n    };\n\n    private renderLastStep = () => {\n        const lastItem = this.items.slice(-1);\n\n        return (\n            <li\n                class=\"last step\"\n                tabindex=\"-1\"\n                aria-current={this.areItemsLinks(this.items) ? 'page' : 'step'}\n            >\n                {this.renderIcon(lastItem[0])}\n                <span class=\"text\">{lastItem[0].text}</span>\n            </li>\n        );\n    };\n\n    private renderIcon = (item: BreadcrumbsItem) => {\n        const name = getIconName(item.icon);\n        const color = getIconColor(item.icon);\n\n        if (!name) {\n            return;\n        }\n\n        return (\n            <limel-icon\n                style={{\n                    color: `${color}`,\n                }}\n                name={name}\n            />\n        );\n    };\n\n    private renderLabel = (item: BreadcrumbsItem) => {\n        if (item.type === 'icon-only') {\n            return;\n        }\n\n        return <span class=\"text\">{item.text}</span>;\n    };\n\n    private renderTooltip = (item: BreadcrumbsItem, tooltipId: string) => {\n        if (item.type === 'icon-only') {\n            return <limel-tooltip elementId={tooltipId} label={item.text} />;\n        }\n    };\n\n    private areItemsLinks = (items: BreadcrumbsItem[]) => {\n        return items.some((item) => 'link' in item);\n    };\n\n    private handleClick = (item: BreadcrumbsItem) => (event: MouseEvent) => {\n        event.stopPropagation();\n        this.select.emit(item);\n    };\n}\n","@use '../../style/functions';\n\n// Note! The `--dropdown-z-index` property is used from `menu.tsx`.\n\n/**\n * @prop --dropdown-z-index: `z-index` of the dropdown menu.\n * @prop --menu-surface-width: Width of the menu surface. Overrides the width defined by `surfaceWidth`.\n * @prop --list-grid-item-max-width: Maximum width of items in the menu list when `gridLayout={true}`. Defaults to `10rem`.\n * @prop --list-grid-item-min-width: Minimum width of items in the menu list when `gridLayout={true}`. Defaults to `7.5rem`.\n * @prop --list-grid-gap: Distance between the items in the menu list when `gridLayout={true}`. Defaults to `0.75rem`.\n * @prop --notification-badge-text-color: Defines the text color of notification badges. Defaults to `--color-white`.\n * @prop --notification-badge-background-color: Defines the background color of notification badges. Defaults to `--color-red-default`.\n */\n\n:host(limel-menu) {\n    isolation: isolate;\n    position: relative;\n    display: inline-block;\n    --badge-background-color: var(\n        --notification-badge-background-color,\n        rgb(var(--color-red-default))\n    );\n    --badge-text-color: var(\n        --notification-badge-text-color,\n        rgb(var(--color-white))\n    );\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n.menu__trigger {\n    border-color: transparent;\n    border-width: 1px;\n    border-style: solid;\n    background: none;\n    color: rgb(var(--contrast-800));\n    height: functions.pxToRem(36);\n\n    &-enabled {\n        &:hover {\n            border-color: rgb(var(--contrast-800));\n            color: rgb(var(--contrast-1100));\n        }\n    }\n}\n\n.mdc-menu-surface--anchor {\n    position: relative;\n}\n\nlimel-badge {\n    position: absolute;\n    top: -0.25rem;\n    right: -0.25rem;\n}\n","/* eslint-disable sonarjs/no-duplicate-string */\nimport {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n    Element,\n    Watch,\n    State,\n} from '@stencil/core';\nimport { createRandomString } from '../../util/random-string';\nimport { zipObject, isFunction } from 'lodash-es';\nimport {\n    LimelBreadcrumbsCustomEvent,\n    LimelInputFieldCustomEvent,\n} from '../../components';\n\nimport { BreadcrumbsItem } from '../breadcrumbs/breadcrumbs.types';\nimport { ListSeparator } from '../list/list-item.types';\nimport {\n    OpenDirection,\n    MenuItem,\n    MenuLoader,\n    SurfaceWidth,\n    MenuSearcher,\n} from './menu.types';\n\nimport {\n    ARROW_DOWN,\n    ARROW_DOWN_KEY_CODE,\n    ARROW_LEFT,\n    ARROW_LEFT_KEY_CODE,\n    ARROW_RIGHT,\n    ARROW_RIGHT_KEY_CODE,\n    ARROW_UP,\n    ARROW_UP_KEY_CODE,\n    TAB,\n    TAB_KEY_CODE,\n} from '../../util/keycodes';\nimport AwesomeDebouncePromise from 'awesome-debounce-promise';\n\ninterface MenuCrumbItem extends BreadcrumbsItem {\n    menuItem: MenuItem;\n}\n\nconst SEARCH_DEBOUNCE = 500;\n\n/**\n * @slot trigger - Element to use as a trigger for the menu.\n * @exampleComponent limel-example-menu-basic\n * @exampleComponent limel-example-menu-disabled\n * @exampleComponent limel-example-menu-open-direction\n * @exampleComponent limel-example-menu-surface-width\n * @exampleComponent limel-example-menu-separators\n * @exampleComponent limel-example-menu-icons\n * @exampleComponent limel-example-menu-badge-icons\n * @exampleComponent limel-example-menu-grid\n * @exampleComponent limel-example-menu-hotkeys\n * @exampleComponent limel-example-menu-secondary-text\n * @exampleComponent limel-example-menu-notification\n * @exampleComponent limel-example-menu-sub-menus\n * @exampleComponent limel-example-menu-sub-menu-lazy-loading\n * @exampleComponent limel-example-menu-sub-menu-lazy-loading-infinite\n * @exampleComponent limel-example-menu-searchable\n * @exampleComponent limel-example-menu-composite\n */\n@Component({\n    tag: 'limel-menu',\n    shadow: true,\n    styleUrl: 'menu.scss',\n})\nexport class Menu {\n    /**\n     * A list of items and separators to show in the menu.\n     */\n    @Prop()\n    public items: Array<MenuItem | ListSeparator> = [];\n\n    /**\n     * Sets the disabled state of the menu.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    /**\n     * Decides the menu's location in relation to its trigger\n     */\n    @Prop({ reflect: true })\n    public openDirection: OpenDirection = 'bottom-start';\n\n    /**\n     * Decides the width of menu's dropdown\n     */\n    @Prop({ reflect: true })\n    public surfaceWidth: SurfaceWidth = 'inherit-from-items';\n\n    /**\n     * Sets the open state of the menu.\n     */\n    @Prop({ mutable: true, reflect: true })\n    public open = false;\n\n    /**\n     * Defines whether the menu should show badges.\n     */\n    @Prop({ reflect: true })\n    public badgeIcons = false;\n\n    /**\n     * Renders list items in a grid layout, rather than a vertical list\n     */\n    @Prop({ reflect: true })\n    public gridLayout = false;\n\n    /**\n     * :::warning Internal Use Only\n     * This property is for internal use only. We need it for now, but want to\n     * find a better implementation of the functionality it currently enables.\n     * If and when we do so, this property will be removed without prior\n     * notice. If you use it, your code _will_ break in the future.\n     * :::\n     *\n     * @internal\n     */\n    @Prop({ reflect: true })\n    public loading = false;\n\n    /**\n     * :::warning Internal Use Only\n     * This property is for internal use only. We need it for now, but want to\n     * find a better implementation of the functionality it currently enables.\n     * If and when we do so, this property will be removed without prior\n     * notice. If you use it, your code _will_ break in the future.\n     * :::\n     *\n     * @internal\n     */\n    @Prop({ mutable: true })\n    public currentSubMenu: MenuItem;\n\n    /**\n     * Is emitted when the menu is cancelled.\n     */\n    @Event()\n    public cancel: EventEmitter<void>;\n\n    /**\n     * Is emitted when a menu item is selected.\n     */\n    @Event()\n    public select: EventEmitter<MenuItem>;\n\n    /**\n     * A search function that takes a search-string as an argument,\n     * and returns a promise that will eventually be resolved with\n     * an array of `MenuItem`:s.\n     *\n     * See the docs for the type `MenuSearcher` for type information on\n     * the searcher function itself.\n     */\n    @Prop()\n    public searcher: MenuSearcher;\n\n    /**\n     * Message to display when search returns 0 results.\n     */\n    @Prop()\n    public emptyResultMessage?: string;\n\n    /**\n     * Is emitted when a menu item with a sub-menu is selected.\n     */\n    @Event()\n    public navigateMenu: EventEmitter<MenuItem>;\n\n    @Element()\n    private host: HTMLLimelMenuElement;\n\n    @State()\n    private loadingSubItems: boolean;\n\n    @State()\n    private menuBreadCrumb: MenuCrumbItem[] = [];\n\n    @State()\n    private searchValue: string;\n\n    @State()\n    private searchResults: Array<MenuItem | ListSeparator>;\n\n    private list: HTMLLimelMenuListElement;\n    private searchInput: HTMLLimelInputFieldElement;\n    private portalId: string;\n    private triggerElement: HTMLSlotElement;\n    private debouncedSearch: MenuSearcher;\n\n    constructor() {\n        this.createDebouncedSearcher = this.createDebouncedSearcher.bind(this);\n        this.portalId = createRandomString();\n    }\n\n    public componentDidLoad() {\n        this.createDebouncedSearcher(this.searcher);\n    }\n\n    public componentDidRender() {\n        const slotElement = this.host.shadowRoot.querySelector('slot');\n        slotElement.assignedElements().forEach(this.setTriggerAttributes);\n    }\n\n    public render() {\n        const cssProperties = this.getCssProperties();\n\n        const dropdownZIndex = getComputedStyle(this.host).getPropertyValue(\n            '--dropdown-z-index',\n        );\n\n        const menuSurfaceWidth = this.getMenuSurfaceWidth(\n            cssProperties['--menu-surface-width'],\n        );\n\n        return (\n            <div class=\"mdc-menu-surface--anchor\" onClick={this.onTriggerClick}>\n                <slot ref={this.setTriggerRef} name=\"trigger\" />\n                {this.renderNotificationBadge()}\n                <limel-portal\n                    visible={this.open}\n                    containerId={this.portalId}\n                    openDirection={this.openDirection}\n                    position=\"absolute\"\n                    containerStyle={{ 'z-index': dropdownZIndex }}\n                >\n                    <limel-menu-surface\n                        open={this.open}\n                        onDismiss={this.onClose}\n                        style={{\n                            ...cssProperties,\n                            '--mdc-menu-min-width': menuSurfaceWidth,\n                            '--limel-menu-surface-display': 'flex',\n                            '--limel-menu-surface-flex-direction': 'column',\n                        }}\n                        class={{\n                            'has-grid-layout': this.gridLayout,\n                        }}\n                    >\n                        {this.renderSearchField()}\n                        {this.renderBreadcrumb()}\n                        {this.renderLoader()}\n                        {this.renderEmptyMessage()}\n                        {this.renderMenuList()}\n                    </limel-menu-surface>\n                </limel-portal>\n            </div>\n        );\n    }\n\n    @Watch('items')\n    protected itemsWatcher() {\n        this.clearSearch();\n        this.setFocus();\n    }\n\n    @Watch('open')\n    protected openWatcher(newValue: boolean) {\n        if (newValue) {\n            this.setFocus();\n        } else {\n            this.clearSearch();\n        }\n    }\n\n    @Watch('currentSubMenu')\n    protected currentSubMenuWatcher() {\n        const breadCrumbItems: MenuCrumbItem[] = [];\n        let currentItem = this.currentSubMenu;\n        while (currentItem) {\n            breadCrumbItems.push({\n                text: currentItem.text,\n                icon: currentItem.icon,\n                menuItem: currentItem,\n            });\n            currentItem = currentItem.parentItem;\n        }\n\n        if (breadCrumbItems.length) {\n            breadCrumbItems.push({\n                text: '',\n                icon: {\n                    name: 'home',\n                },\n                type: 'icon-only',\n            } as MenuCrumbItem);\n        }\n\n        this.menuBreadCrumb = breadCrumbItems.reverse();\n    }\n\n    @Watch('searcher')\n    protected createDebouncedSearcher(newValue: MenuSearcher) {\n        if (typeof newValue !== 'function') {\n            return;\n        }\n\n        this.debouncedSearch = AwesomeDebouncePromise(\n            newValue,\n            SEARCH_DEBOUNCE,\n        );\n    }\n\n    private renderLoader = () => {\n        if (!this.loadingSubItems && !this.loading) {\n            return;\n        }\n\n        const cssProperties = this.getCssProperties();\n\n        return (\n            <div\n                style={{\n                    width: cssProperties['--menu-surface-width'],\n                    display: 'flex',\n                    'align-items': 'center',\n                    'justify-content': 'center',\n                    padding: '0.5rem 0',\n                }}\n            >\n                <limel-spinner size=\"mini\" limeBranded={false} />\n            </div>\n        );\n    };\n\n    private renderBreadcrumb = () => {\n        if (!this.menuBreadCrumb?.length) {\n            return;\n        }\n\n        return (\n            <limel-breadcrumbs\n                style={{\n                    'border-bottom': 'solid 1px rgb(var(--contrast-500))',\n                    'flex-shrink': '0',\n                }}\n                onSelect={this.handleBreadcrumbsSelect}\n                items={this.menuBreadCrumb}\n            />\n        );\n    };\n\n    private handleBreadcrumbsSelect = (\n        event: LimelBreadcrumbsCustomEvent<MenuCrumbItem>,\n    ) => {\n        if (!event.detail.menuItem) {\n            this.currentSubMenu = null;\n            this.clearSearch();\n            this.navigateMenu.emit(null);\n\n            this.setFocus();\n\n            return;\n        }\n\n        this.handleSelect(event.detail.menuItem);\n    };\n\n    private renderSearchField = () => {\n        if (!this.searcher) {\n            return;\n        }\n\n        return (\n            <limel-input-field\n                tabindex=\"0\"\n                ref={this.setSearchElement}\n                type=\"search\"\n                leadingIcon=\"search\"\n                style={{\n                    padding: '0.25rem',\n                    'box-sizing': 'border-box',\n                }}\n                value={this.searchValue}\n                onChange={this.handleTextInput}\n                onKeyDown={this.handleInputKeyDown}\n            />\n        );\n    };\n\n    private renderEmptyMessage = () => {\n        if (\n            this.loading ||\n            this.loadingSubItems ||\n            !this.emptyResultMessage ||\n            !Array.isArray(this.searchResults) ||\n            this.searchResults?.length\n        ) {\n            return null;\n        }\n\n        return (\n            <p\n                style={{\n                    padding: '0 1rem',\n                    'text-align': 'center',\n                }}\n            >\n                {this.emptyResultMessage}\n            </p>\n        );\n    };\n\n    private renderMenuList = () => {\n        let items = this.visibleItems;\n\n        if (this.loadingSubItems || this.loading) {\n            items = [];\n        }\n\n        return (\n            <limel-menu-list\n                style={{\n                    'overflow-y': 'auto',\n                    'flex-grow': '1',\n                }}\n                class={{\n                    'has-grid-layout has-interactive-items': this.gridLayout,\n                }}\n                items={items}\n                type=\"menu\"\n                badgeIcons={this.badgeIcons}\n                onSelect={this.onSelect}\n                ref={this.setListElement}\n                onKeyDown={this.handleMenuKeyDown}\n            />\n        );\n    };\n\n    private handleTextInput = async (\n        event: LimelInputFieldCustomEvent<string>,\n    ) => {\n        event.stopPropagation();\n\n        const query = event.detail;\n        this.searchValue = query;\n        if (query === '') {\n            this.searchResults = null;\n\n            return;\n        }\n\n        this.loadingSubItems = true;\n\n        const result = await this.debouncedSearch(query);\n\n        this.searchResults = result;\n        this.loadingSubItems = false;\n    };\n\n    // Key handler for the input search field\n    // Will change focus to the first/last item in the dropdown\n    // list to enable selection with the keyboard\n    private handleInputKeyDown = (event: KeyboardEvent) => {\n        const isForwardTab =\n            (event.key === TAB || event.keyCode === TAB_KEY_CODE) &&\n            !event.altKey &&\n            !event.metaKey &&\n            !event.shiftKey;\n        const isUp =\n            event.key === ARROW_UP || event.keyCode === ARROW_UP_KEY_CODE;\n        const isDown =\n            event.key === ARROW_DOWN || event.keyCode === ARROW_DOWN_KEY_CODE;\n\n        if (!isForwardTab && !isUp && !isDown) {\n            return;\n        }\n\n        if (!this.list) {\n            return;\n        }\n\n        event.stopPropagation();\n        event.preventDefault();\n\n        if (isForwardTab || isDown) {\n            const listItems =\n                this.list.shadowRoot.querySelectorAll<HTMLElement>(\n                    '.mdc-deprecated-list-item',\n                );\n            const listElement = listItems[0];\n            listElement?.focus();\n\n            return;\n        }\n\n        if (isUp) {\n            const listItems =\n                this.list.shadowRoot.querySelectorAll<HTMLElement>(\n                    '.mdc-deprecated-list-item',\n                );\n            const listElement = listItems[listItems.length - 1];\n            listElement?.focus();\n        }\n    };\n\n    // Key handler for the menu list\n    // Will change focus to the search field if using shift+tab\n    // And can go forward/back with righ/left arrow keys\n    private handleMenuKeyDown = (event: KeyboardEvent) => {\n        const isBackwardTab =\n            (event.key === TAB || event.keyCode === TAB_KEY_CODE) &&\n            !event.altKey &&\n            !event.metaKey &&\n            event.shiftKey;\n\n        const isLeft =\n            event.key === ARROW_LEFT || event.keyCode === ARROW_LEFT_KEY_CODE;\n\n        const isRight =\n            event.key === ARROW_RIGHT || event.keyCode === ARROW_RIGHT_KEY_CODE;\n\n        if (!isBackwardTab && !isLeft && !isRight) {\n            return;\n        }\n\n        if (isBackwardTab) {\n            event.stopPropagation();\n            event.preventDefault();\n            this.searchInput?.focus();\n        } else if (!this.gridLayout) {\n            const currentItem = this.getCurrentItem();\n\n            event.stopPropagation();\n            event.preventDefault();\n            if (isRight) {\n                this.goForward(currentItem);\n            } else if (isLeft) {\n                this.goBack();\n            }\n        }\n    };\n\n    private clearSearch = () => {\n        this.searchValue = '';\n        this.searchResults = null;\n    };\n\n    private getCurrentItem = (): MenuItem => {\n        const activeItem = this.list?.shadowRoot?.querySelector(\n            '[role=\"menuitem\"][tabindex=\"0\"]',\n        );\n        const attrIndex = activeItem?.attributes?.getNamedItem('data-index');\n        const dataIndex = parseInt(attrIndex?.value || '0', 10);\n\n        return this.visibleItems[dataIndex] as MenuItem;\n    };\n\n    private goForward = (currentItem: MenuItem) => {\n        this.handleSelect(currentItem, false);\n    };\n\n    private goBack = () => {\n        if (!this.currentSubMenu) {\n            // Already in the root of the menu\n            return;\n        }\n\n        const parent = this.currentSubMenu.parentItem;\n        if (!parent) {\n            // If only one step down, go to the root of the menu.\n            // No need to load a sub-menu.\n            this.currentSubMenu = null;\n            this.clearSearch();\n            this.navigateMenu.emit(null);\n\n            this.setFocus();\n\n            return;\n        }\n\n        this.handleSelect(parent);\n    };\n\n    private setTriggerAttributes = (element: HTMLElement) => {\n        const attributes = {\n            'aria-haspopup': true,\n            'aria-expanded': this.open,\n            disabled: this.disabled,\n            role: 'button',\n        };\n\n        for (const [key, value] of Object.entries(attributes)) {\n            if (!value) {\n                element.removeAttribute(key);\n            } else {\n                element.setAttribute(key, String(value));\n            }\n        }\n    };\n\n    private onClose = () => {\n        this.cancel.emit();\n        this.open = false;\n        this.currentSubMenu = null;\n    };\n\n    private onTriggerClick = (event: MouseEvent) => {\n        event.stopPropagation();\n        if (this.disabled) {\n            return;\n        }\n\n        this.open = !this.open;\n    };\n\n    private handleSelect = async (\n        menuItem: MenuItem,\n        selectOnEmptyChildren: boolean = true,\n    ) => {\n        if (Array.isArray(menuItem?.items) && menuItem.items.length > 0) {\n            this.clearSearch();\n            this.currentSubMenu = menuItem;\n            this.navigateMenu.emit(menuItem);\n\n            this.setFocus();\n\n            return;\n        } else if (isFunction(menuItem?.items)) {\n            const menuLoader = menuItem.items as MenuLoader;\n            this.loadingSubItems = true;\n            const subItems = await menuLoader(menuItem);\n            menuItem.items = subItems;\n            this.loadingSubItems = false;\n\n            if (subItems?.length) {\n                this.currentSubMenu = menuItem;\n                this.clearSearch();\n                this.navigateMenu.emit(menuItem);\n\n                this.setFocus();\n\n                return;\n            }\n        }\n\n        if (!selectOnEmptyChildren) {\n            return;\n        }\n\n        this.select.emit(menuItem);\n        this.open = false;\n        this.currentSubMenu = null;\n        this.setFocus();\n    };\n\n    private onSelect = (event: CustomEvent<MenuItem>) => {\n        event.stopPropagation();\n        this.handleSelect(event.detail);\n    };\n\n    private getCssProperties() {\n        const propertyNames = [\n            '--menu-surface-width',\n            '--list-grid-item-max-width',\n            '--list-grid-item-min-width',\n            '--list-grid-gap',\n            '--notification-badge-background-color',\n            '--notification-badge-text-color',\n        ] as const;\n        const style = getComputedStyle(this.host);\n        const values = propertyNames.map((property) => {\n            return style.getPropertyValue(property);\n        });\n\n        type PropName = (typeof propertyNames)[number];\n\n        return zipObject(propertyNames, values) as Record<PropName, string>;\n    }\n\n    private setListElement = (element: HTMLLimelMenuListElement) => {\n        this.list = element;\n    };\n\n    private setFocus = () => {\n        setTimeout(() => {\n            if (this.searchInput && this.searcher) {\n                const observer = new IntersectionObserver(() => {\n                    observer.unobserve(this.searchInput);\n                    if (this.searchInput === window.document.activeElement) {\n                        return;\n                    }\n\n                    this.searchInput.focus();\n                });\n                observer.observe(this.searchInput);\n            } else if (this.list) {\n                const observer = new IntersectionObserver(() => {\n                    observer.unobserve(this.list);\n                    this.focusMenuItem();\n                });\n                observer.observe(this.list);\n            }\n        }, 0);\n    };\n\n    private setSearchElement = (element: HTMLLimelInputFieldElement) => {\n        this.searchInput = element;\n    };\n\n    private focusMenuItem = () => {\n        if (!this.list) {\n            return;\n        }\n\n        const activeElement = this.list.shadowRoot.activeElement as HTMLElement;\n        activeElement?.blur();\n\n        const menuItems = this.visibleItems.filter(this.isMenuItem);\n        const selectedIndex = Math.max(\n            menuItems.findIndex((item) => item.selected),\n            0,\n        );\n        const menuElements: HTMLElement[] = Array.from(\n            this.list.shadowRoot.querySelectorAll('[role=\"menuitem\"]'),\n        );\n        menuElements[selectedIndex]?.focus();\n    };\n\n    private isMenuItem(item: MenuItem | ListSeparator): item is MenuItem {\n        return !('separator' in item);\n    }\n\n    private renderNotificationBadge = () => {\n        if (this.items.some(this.hasNotificationBadge)) {\n            return <limel-badge />;\n        }\n    };\n\n    private hasNotificationBadge = (item: MenuItem | ListSeparator) =>\n        this.isMenuItem(item) && item.badge !== undefined;\n\n    private setTriggerRef = (elm?: HTMLSlotElement) => {\n        this.triggerElement = elm;\n    };\n\n    private getMenuSurfaceWidth(customWidth: string): string {\n        if (customWidth) {\n            return customWidth;\n        }\n\n        if (this.surfaceWidth === 'inherit-from-trigger') {\n            const assignedTriggers = this.triggerElement?.assignedElements();\n\n            if (\n                !assignedTriggers?.length ||\n                !assignedTriggers[0]?.clientWidth\n            ) {\n                return '';\n            }\n\n            return `${assignedTriggers[0].clientWidth}px`;\n        } else if (this.surfaceWidth === 'inherit-from-menu') {\n            if (!this.host?.clientWidth) {\n                return '';\n            }\n\n            return `${this.host?.clientWidth}px`;\n        }\n\n        return '';\n    }\n\n    private get visibleItems(): Array<MenuItem | ListSeparator> {\n        if (Array.isArray(this.searchResults) && this.searchValue) {\n            return this.searchResults;\n        } else if (Array.isArray(this.currentSubMenu?.items)) {\n            return this.currentSubMenu.items.map((item) => ({\n                ...item,\n                parentItem: this.currentSubMenu,\n            }));\n        }\n\n        return this.items;\n    }\n}\n","/**\n * @license\n * Copyright 2018 Google Inc.\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */\nvar cssClasses = {\n    MENU_SELECTED_LIST_ITEM: 'mdc-menu-item--selected',\n    MENU_SELECTION_GROUP: 'mdc-menu__selection-group',\n    ROOT: 'mdc-menu',\n};\nvar strings = {\n    ARIA_CHECKED_ATTR: 'aria-checked',\n    ARIA_DISABLED_ATTR: 'aria-disabled',\n    CHECKBOX_SELECTOR: 'input[type=\"checkbox\"]',\n    LIST_SELECTOR: '.mdc-list,.mdc-deprecated-list',\n    SELECTED_EVENT: 'MDCMenu:selected',\n    SKIP_RESTORE_FOCUS: 'data-menu-item-skip-restore-focus',\n};\nvar numbers = {\n    FOCUS_ROOT_INDEX: -1,\n};\nvar DefaultFocusState;\n(function (DefaultFocusState) {\n    DefaultFocusState[DefaultFocusState[\"NONE\"] = 0] = \"NONE\";\n    DefaultFocusState[DefaultFocusState[\"LIST_ROOT\"] = 1] = \"LIST_ROOT\";\n    DefaultFocusState[DefaultFocusState[\"FIRST_ITEM\"] = 2] = \"FIRST_ITEM\";\n    DefaultFocusState[DefaultFocusState[\"LAST_ITEM\"] = 3] = \"LAST_ITEM\";\n})(DefaultFocusState || (DefaultFocusState = {}));\nexport { cssClasses, strings, numbers, DefaultFocusState };\n//# sourceMappingURL=constants.js.map","/**\n * @license\n * Copyright 2018 Google Inc.\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */\nimport { __assign, __extends } from \"tslib\";\nimport { MDCFoundation } from '@material/base/foundation';\nimport { cssClasses as listCssClasses } from '@material/list/constants';\nimport { MDCMenuSurfaceFoundation } from '@material/menu-surface/foundation';\nimport { cssClasses, DefaultFocusState, numbers, strings } from './constants';\nvar MDCMenuFoundation = /** @class */ (function (_super) {\n    __extends(MDCMenuFoundation, _super);\n    function MDCMenuFoundation(adapter) {\n        var _this = _super.call(this, __assign(__assign({}, MDCMenuFoundation.defaultAdapter), adapter)) || this;\n        _this.closeAnimationEndTimerId = 0;\n        _this.defaultFocusState = DefaultFocusState.LIST_ROOT;\n        _this.selectedIndex = -1;\n        return _this;\n    }\n    Object.defineProperty(MDCMenuFoundation, \"cssClasses\", {\n        get: function () {\n            return cssClasses;\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenuFoundation, \"strings\", {\n        get: function () {\n            return strings;\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenuFoundation, \"numbers\", {\n        get: function () {\n            return numbers;\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenuFoundation, \"defaultAdapter\", {\n        /**\n         * @see {@link MDCMenuAdapter} for typing information on parameters and return types.\n         */\n        get: function () {\n            // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.\n            return {\n                addClassToElementAtIndex: function () { return undefined; },\n                removeClassFromElementAtIndex: function () { return undefined; },\n                addAttributeToElementAtIndex: function () { return undefined; },\n                removeAttributeFromElementAtIndex: function () { return undefined; },\n                getAttributeFromElementAtIndex: function () { return null; },\n                elementContainsClass: function () { return false; },\n                closeSurface: function () { return undefined; },\n                getElementIndex: function () { return -1; },\n                notifySelected: function () { return undefined; },\n                getMenuItemCount: function () { return 0; },\n                focusItemAtIndex: function () { return undefined; },\n                focusListRoot: function () { return undefined; },\n                getSelectedSiblingOfItemAtIndex: function () { return -1; },\n                isSelectableItemAtIndex: function () { return false; },\n            };\n            // tslint:enable:object-literal-sort-keys\n        },\n        enumerable: false,\n        configurable: true\n    });\n    MDCMenuFoundation.prototype.destroy = function () {\n        if (this.closeAnimationEndTimerId) {\n            clearTimeout(this.closeAnimationEndTimerId);\n        }\n        this.adapter.closeSurface();\n    };\n    MDCMenuFoundation.prototype.handleKeydown = function (evt) {\n        var key = evt.key, keyCode = evt.keyCode;\n        var isTab = key === 'Tab' || keyCode === 9;\n        if (isTab) {\n            this.adapter.closeSurface(/** skipRestoreFocus */ true);\n        }\n    };\n    MDCMenuFoundation.prototype.handleItemAction = function (listItem) {\n        var _this = this;\n        var index = this.adapter.getElementIndex(listItem);\n        if (index < 0) {\n            return;\n        }\n        this.adapter.notifySelected({ index: index });\n        var skipRestoreFocus = this.adapter.getAttributeFromElementAtIndex(index, strings.SKIP_RESTORE_FOCUS) === 'true';\n        this.adapter.closeSurface(skipRestoreFocus);\n        // Wait for the menu to close before adding/removing classes that affect styles.\n        this.closeAnimationEndTimerId = setTimeout(function () {\n            // Recompute the index in case the menu contents have changed.\n            var recomputedIndex = _this.adapter.getElementIndex(listItem);\n            if (recomputedIndex >= 0 &&\n                _this.adapter.isSelectableItemAtIndex(recomputedIndex)) {\n                _this.setSelectedIndex(recomputedIndex);\n            }\n        }, MDCMenuSurfaceFoundation.numbers.TRANSITION_CLOSE_DURATION);\n    };\n    MDCMenuFoundation.prototype.handleMenuSurfaceOpened = function () {\n        switch (this.defaultFocusState) {\n            case DefaultFocusState.FIRST_ITEM:\n                this.adapter.focusItemAtIndex(0);\n                break;\n            case DefaultFocusState.LAST_ITEM:\n                this.adapter.focusItemAtIndex(this.adapter.getMenuItemCount() - 1);\n                break;\n            case DefaultFocusState.NONE:\n                // Do nothing.\n                break;\n            default:\n                this.adapter.focusListRoot();\n                break;\n        }\n    };\n    /**\n     * Sets default focus state where the menu should focus every time when menu\n     * is opened. Focuses the list root (`DefaultFocusState.LIST_ROOT`) element by\n     * default.\n     */\n    MDCMenuFoundation.prototype.setDefaultFocusState = function (focusState) {\n        this.defaultFocusState = focusState;\n    };\n    /** @return Index of the currently selected list item within the menu. */\n    MDCMenuFoundation.prototype.getSelectedIndex = function () {\n        return this.selectedIndex;\n    };\n    /**\n     * Selects the list item at `index` within the menu.\n     * @param index Index of list item within the menu.\n     */\n    MDCMenuFoundation.prototype.setSelectedIndex = function (index) {\n        this.validatedIndex(index);\n        if (!this.adapter.isSelectableItemAtIndex(index)) {\n            throw new Error('MDCMenuFoundation: No selection group at specified index.');\n        }\n        var prevSelectedIndex = this.adapter.getSelectedSiblingOfItemAtIndex(index);\n        if (prevSelectedIndex >= 0) {\n            this.adapter.removeAttributeFromElementAtIndex(prevSelectedIndex, strings.ARIA_CHECKED_ATTR);\n            this.adapter.removeClassFromElementAtIndex(prevSelectedIndex, cssClasses.MENU_SELECTED_LIST_ITEM);\n        }\n        this.adapter.addClassToElementAtIndex(index, cssClasses.MENU_SELECTED_LIST_ITEM);\n        this.adapter.addAttributeToElementAtIndex(index, strings.ARIA_CHECKED_ATTR, 'true');\n        this.selectedIndex = index;\n    };\n    /**\n     * Sets the enabled state to isEnabled for the menu item at the given index.\n     * @param index Index of the menu item\n     * @param isEnabled The desired enabled state of the menu item.\n     */\n    MDCMenuFoundation.prototype.setEnabled = function (index, isEnabled) {\n        this.validatedIndex(index);\n        if (isEnabled) {\n            this.adapter.removeClassFromElementAtIndex(index, listCssClasses.LIST_ITEM_DISABLED_CLASS);\n            this.adapter.addAttributeToElementAtIndex(index, strings.ARIA_DISABLED_ATTR, 'false');\n        }\n        else {\n            this.adapter.addClassToElementAtIndex(index, listCssClasses.LIST_ITEM_DISABLED_CLASS);\n            this.adapter.addAttributeToElementAtIndex(index, strings.ARIA_DISABLED_ATTR, 'true');\n        }\n    };\n    MDCMenuFoundation.prototype.validatedIndex = function (index) {\n        var menuSize = this.adapter.getMenuItemCount();\n        var isIndexInRange = index >= 0 && index < menuSize;\n        if (!isIndexInRange) {\n            throw new Error('MDCMenuFoundation: No list item at specified index.');\n        }\n    };\n    return MDCMenuFoundation;\n}(MDCFoundation));\nexport { MDCMenuFoundation };\n// tslint:disable-next-line:no-default-export Needed for backward compatibility with MDC Web v0.44.0 and earlier.\nexport default MDCMenuFoundation;\n//# sourceMappingURL=foundation.js.map","/**\n * @license\n * Copyright 2018 Google Inc.\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */\nimport { __extends } from \"tslib\";\nimport { MDCComponent } from '@material/base/component';\nimport { closest } from '@material/dom/ponyfill';\nimport { MDCList } from '@material/list/component';\nimport { numbers as listConstants } from '@material/list/constants';\nimport { MDCListFoundation } from '@material/list/foundation';\nimport { MDCMenuSurface } from '@material/menu-surface/component';\nimport { MDCMenuSurfaceFoundation } from '@material/menu-surface/foundation';\nimport { cssClasses, strings } from './constants';\nimport { MDCMenuFoundation } from './foundation';\nvar MDCMenu = /** @class */ (function (_super) {\n    __extends(MDCMenu, _super);\n    function MDCMenu() {\n        return _super !== null && _super.apply(this, arguments) || this;\n    }\n    MDCMenu.attachTo = function (root) {\n        return new MDCMenu(root);\n    };\n    MDCMenu.prototype.initialize = function (menuSurfaceFactory, listFactory) {\n        if (menuSurfaceFactory === void 0) { menuSurfaceFactory = function (el) { return new MDCMenuSurface(el); }; }\n        if (listFactory === void 0) { listFactory = function (el) { return new MDCList(el); }; }\n        this.menuSurfaceFactory = menuSurfaceFactory;\n        this.listFactory = listFactory;\n    };\n    MDCMenu.prototype.initialSyncWithDOM = function () {\n        var _this = this;\n        this.menuSurface = this.menuSurfaceFactory(this.root);\n        var list = this.root.querySelector(strings.LIST_SELECTOR);\n        if (list) {\n            this.list = this.listFactory(list);\n            this.list.wrapFocus = true;\n        }\n        else {\n            this.list = null;\n        }\n        this.handleKeydown = function (evt) {\n            _this.foundation.handleKeydown(evt);\n        };\n        this.handleItemAction = function (evt) {\n            _this.foundation.handleItemAction(_this.items[evt.detail.index]);\n        };\n        this.handleMenuSurfaceOpened = function () {\n            _this.foundation.handleMenuSurfaceOpened();\n        };\n        this.menuSurface.listen(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, this.handleMenuSurfaceOpened);\n        this.listen('keydown', this.handleKeydown);\n        this.listen(MDCListFoundation.strings.ACTION_EVENT, this.handleItemAction);\n    };\n    MDCMenu.prototype.destroy = function () {\n        if (this.list) {\n            this.list.destroy();\n        }\n        this.menuSurface.destroy();\n        this.menuSurface.unlisten(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, this.handleMenuSurfaceOpened);\n        this.unlisten('keydown', this.handleKeydown);\n        this.unlisten(MDCListFoundation.strings.ACTION_EVENT, this.handleItemAction);\n        _super.prototype.destroy.call(this);\n    };\n    Object.defineProperty(MDCMenu.prototype, \"open\", {\n        get: function () {\n            return this.menuSurface.isOpen();\n        },\n        set: function (value) {\n            if (value) {\n                this.menuSurface.open();\n            }\n            else {\n                this.menuSurface.close();\n            }\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenu.prototype, \"wrapFocus\", {\n        get: function () {\n            return this.list ? this.list.wrapFocus : false;\n        },\n        set: function (value) {\n            if (this.list) {\n                this.list.wrapFocus = value;\n            }\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenu.prototype, \"hasTypeahead\", {\n        /**\n         * Sets whether the menu has typeahead functionality.\n         * @param value Whether typeahead is enabled.\n         */\n        set: function (value) {\n            if (this.list) {\n                this.list.hasTypeahead = value;\n            }\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenu.prototype, \"typeaheadInProgress\", {\n        /**\n         * @return Whether typeahead logic is currently matching some user prefix.\n         */\n        get: function () {\n            return this.list ? this.list.typeaheadInProgress : false;\n        },\n        enumerable: false,\n        configurable: true\n    });\n    /**\n     * Given the next desired character from the user, adds it to the typeahead\n     * buffer. Then, attempts to find the next option matching the buffer. Wraps\n     * around if at the end of options.\n     *\n     * @param nextChar The next character to add to the prefix buffer.\n     * @param startingIndex The index from which to start matching. Only relevant\n     *     when starting a new match sequence. To start a new match sequence,\n     *     clear the buffer using `clearTypeaheadBuffer`, or wait for the buffer\n     *     to clear after a set interval defined in list foundation. Defaults to\n     *     the currently focused index.\n     * @return The index of the matched item, or -1 if no match.\n     */\n    MDCMenu.prototype.typeaheadMatchItem = function (nextChar, startingIndex) {\n        if (this.list) {\n            return this.list.typeaheadMatchItem(nextChar, startingIndex);\n        }\n        return -1;\n    };\n    /**\n     * Layout the underlying list element in the case of any dynamic updates\n     * to its structure.\n     */\n    MDCMenu.prototype.layout = function () {\n        if (this.list) {\n            this.list.layout();\n        }\n    };\n    Object.defineProperty(MDCMenu.prototype, \"items\", {\n        /**\n         * Return the items within the menu. Note that this only contains the set of elements within\n         * the items container that are proper list items, and not supplemental / presentational DOM\n         * elements.\n         */\n        get: function () {\n            return this.list ? this.list.listElements : [];\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenu.prototype, \"singleSelection\", {\n        /**\n         * Turns on/off the underlying list's single selection mode. Used mainly\n         * by select menu.\n         *\n         * @param singleSelection Whether to enable single selection mode.\n         */\n        set: function (singleSelection) {\n            if (this.list) {\n                this.list.singleSelection = singleSelection;\n            }\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenu.prototype, \"selectedIndex\", {\n        /**\n         * Retrieves the selected index. Only applicable to select menus.\n         * @return The selected index, which is a number for single selection and\n         *     radio lists, and an array of numbers for checkbox lists.\n         */\n        get: function () {\n            return this.list ? this.list.selectedIndex : listConstants.UNSET_INDEX;\n        },\n        /**\n         * Sets the selected index of the list. Only applicable to select menus.\n         * @param index The selected index, which is a number for single selection and\n         *     radio lists, and an array of numbers for checkbox lists.\n         */\n        set: function (index) {\n            if (this.list) {\n                this.list.selectedIndex = index;\n            }\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCMenu.prototype, \"quickOpen\", {\n        set: function (quickOpen) {\n            this.menuSurface.quickOpen = quickOpen;\n        },\n        enumerable: false,\n        configurable: true\n    });\n    /**\n     * Sets default focus state where the menu should focus every time when menu\n     * is opened. Focuses the list root (`DefaultFocusState.LIST_ROOT`) element by\n     * default.\n     * @param focusState Default focus state.\n     */\n    MDCMenu.prototype.setDefaultFocusState = function (focusState) {\n        this.foundation.setDefaultFocusState(focusState);\n    };\n    /**\n     * @param corner Default anchor corner alignment of top-left menu corner.\n     */\n    MDCMenu.prototype.setAnchorCorner = function (corner) {\n        this.menuSurface.setAnchorCorner(corner);\n    };\n    MDCMenu.prototype.setAnchorMargin = function (margin) {\n        this.menuSurface.setAnchorMargin(margin);\n    };\n    /**\n     * Sets the list item as the selected row at the specified index.\n     * @param index Index of list item within menu.\n     */\n    MDCMenu.prototype.setSelectedIndex = function (index) {\n        this.foundation.setSelectedIndex(index);\n    };\n    /**\n     * Sets the enabled state to isEnabled for the menu item at the given index.\n     * @param index Index of the menu item\n     * @param isEnabled The desired enabled state of the menu item.\n     */\n    MDCMenu.prototype.setEnabled = function (index, isEnabled) {\n        this.foundation.setEnabled(index, isEnabled);\n    };\n    /**\n     * @return The item within the menu at the index specified.\n     */\n    MDCMenu.prototype.getOptionByIndex = function (index) {\n        var items = this.items;\n        if (index < items.length) {\n            return this.items[index];\n        }\n        else {\n            return null;\n        }\n    };\n    /**\n     * @param index A menu item's index.\n     * @return The primary text within the menu at the index specified.\n     */\n    MDCMenu.prototype.getPrimaryTextAtIndex = function (index) {\n        var item = this.getOptionByIndex(index);\n        if (item && this.list) {\n            return this.list.getPrimaryText(item) || '';\n        }\n        return '';\n    };\n    MDCMenu.prototype.setFixedPosition = function (isFixed) {\n        this.menuSurface.setFixedPosition(isFixed);\n    };\n    MDCMenu.prototype.setIsHoisted = function (isHoisted) {\n        this.menuSurface.setIsHoisted(isHoisted);\n    };\n    MDCMenu.prototype.setAbsolutePosition = function (x, y) {\n        this.menuSurface.setAbsolutePosition(x, y);\n    };\n    /**\n     * Sets the element that the menu-surface is anchored to.\n     */\n    MDCMenu.prototype.setAnchorElement = function (element) {\n        this.menuSurface.anchorElement = element;\n    };\n    MDCMenu.prototype.getDefaultFoundation = function () {\n        var _this = this;\n        // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.\n        // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.\n        // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.\n        var adapter = {\n            addClassToElementAtIndex: function (index, className) {\n                var list = _this.items;\n                list[index].classList.add(className);\n            },\n            removeClassFromElementAtIndex: function (index, className) {\n                var list = _this.items;\n                list[index].classList.remove(className);\n            },\n            addAttributeToElementAtIndex: function (index, attr, value) {\n                var list = _this.items;\n                list[index].setAttribute(attr, value);\n            },\n            removeAttributeFromElementAtIndex: function (index, attr) {\n                var list = _this.items;\n                list[index].removeAttribute(attr);\n            },\n            getAttributeFromElementAtIndex: function (index, attr) {\n                var list = _this.items;\n                return list[index].getAttribute(attr);\n            },\n            elementContainsClass: function (element, className) {\n                return element.classList.contains(className);\n            },\n            closeSurface: function (skipRestoreFocus) {\n                _this.menuSurface.close(skipRestoreFocus);\n            },\n            getElementIndex: function (element) { return _this.items.indexOf(element); },\n            notifySelected: function (evtData) {\n                _this.emit(strings.SELECTED_EVENT, {\n                    index: evtData.index,\n                    item: _this.items[evtData.index],\n                });\n            },\n            getMenuItemCount: function () { return _this.items.length; },\n            focusItemAtIndex: function (index) {\n                _this.items[index].focus();\n            },\n            focusListRoot: function () {\n                _this.root.querySelector(strings.LIST_SELECTOR).focus();\n            },\n            isSelectableItemAtIndex: function (index) {\n                return !!closest(_this.items[index], \".\" + cssClasses.MENU_SELECTION_GROUP);\n            },\n            getSelectedSiblingOfItemAtIndex: function (index) {\n                var selectionGroupEl = closest(_this.items[index], \".\" + cssClasses.MENU_SELECTION_GROUP);\n                var selectedItemEl = selectionGroupEl.querySelector(\".\" + cssClasses.MENU_SELECTED_LIST_ITEM);\n                return selectedItemEl ? _this.items.indexOf(selectedItemEl) : -1;\n            },\n        };\n        // tslint:enable:object-literal-sort-keys\n        return new MDCMenuFoundation(adapter);\n    };\n    return MDCMenu;\n}(MDCComponent));\nexport { MDCMenu };\n//# sourceMappingURL=component.js.map","import { ListSeparator } from '../list/list-item.types';\nimport { MenuItem } from '../menu/menu.types';\nimport { h } from '@stencil/core';\nimport { MenuListRendererConfig } from './menu-list-renderer-config';\nimport { getIconColor, getIconName } from '../icon/get-icon-props';\nimport { isFunction } from 'lodash-es';\n\nexport class MenuListRenderer {\n    private defaultConfig: MenuListRendererConfig = {\n        isOpen: true,\n        badgeIcons: false,\n    };\n\n    private config: MenuListRendererConfig;\n\n    private hasIcons: boolean;\n    private twoLines: boolean;\n    private avatarList: boolean;\n    private commandKey: boolean;\n\n    private applyTabIndexToItemAtIndex: number;\n\n    public render(\n        items: Array<MenuItem | ListSeparator>,\n        config: MenuListRendererConfig = {},\n    ) {\n        items = items || [];\n        this.config = { ...this.defaultConfig, ...config };\n\n        this.twoLines = items.some((item) => {\n            return 'secondaryText' in item && !!item.secondaryText;\n        });\n\n        this.commandKey = items.some((item) => {\n            return 'commandText' in item && !!item.commandText;\n        });\n\n        this.hasIcons = items.some((item) => {\n            return 'icon' in item && !!item.icon;\n        });\n\n        this.avatarList = this.config.badgeIcons && this.hasIcons;\n\n        this.applyTabIndexToItemAtIndex =\n            this.getIndexForWhichToApplyTabIndex(items);\n\n        const classNames = {\n            'mdc-deprecated-list': true,\n            'mdc-deprecated-list--two-line': this.twoLines,\n            selectable: true,\n            'mdc-deprecated-list--avatar-list': this.avatarList,\n            'list--compact':\n                this.twoLines &&\n                this.commandKey &&\n                ['small', 'x-small'].includes(this.config.iconSize),\n        };\n\n        return (\n            <ul\n                class={classNames}\n                aria-hidden={true}\n                role=\"menu\"\n                aria-orientation=\"vertical\"\n                style={{ '--maxLinesSecondaryText': '2' }}\n            >\n                {items.map(this.renderMenuItem)}\n            </ul>\n        );\n    }\n\n    /**\n     * Determine which MenuItem should have the `tab-index` attribute set,\n     * and return the index at which that MenuItem is located in `items`.\n     * Returns `undefined` if no item should have the attribute set.\n     * See https://github.com/material-components/material-components-web/tree/e66a43a75fef4f9179e24856649518e15e279a04/packages/mdc-list#accessibility\n     *\n     * @param items - the items of the list, including any `ListSeparator`:s\n     * @returns the index as per the description\n     */\n    private getIndexForWhichToApplyTabIndex = (\n        items: Array<MenuItem | ListSeparator>,\n    ) => {\n        let result;\n        for (let i = 0, max = items.length; i < max; i += 1) {\n            if ('separator' in items[i]) {\n                // Ignore ListSeparator\n            } else {\n                const item = items[i] as MenuItem<any>;\n                if (item.selected) {\n                    result = i;\n                    break;\n                }\n\n                if (result === undefined && !item.disabled) {\n                    result = i;\n                    // Do NOT break, as any later item with\n                    // `selected=true` should get the tab-index instead!\n                }\n            }\n        }\n\n        return result;\n    };\n\n    /**\n     * Render a single list item\n     *\n     * @param item - the item to render\n     * @param index - the index the item had in the `items` array\n     * @returns the list item\n     */\n    private renderMenuItem = (\n        item: MenuItem | ListSeparator,\n        index: number,\n    ) => {\n        if ('separator' in item) {\n            return (\n                <li class=\"mdc-deprecated-list-divider\" role=\"separator\">\n                    {this.rendertext(item)}\n                    <div class=\"limel-list-divider-line\" />\n                </li>\n            );\n        }\n\n        const classNames = {\n            'mdc-deprecated-list-item': true,\n            'mdc-deprecated-list-item--disabled': item.disabled,\n            'mdc-deprecated-list-item--selected': item.selected,\n        };\n\n        const attributes: { tabindex?: string } = {};\n        if (index === this.applyTabIndexToItemAtIndex) {\n            attributes.tabindex = '0';\n        }\n\n        return (\n            <li\n                class={classNames}\n                role=\"menuitem\"\n                aria-disabled={item.disabled ? 'true' : 'false'}\n                aria-selected={item.selected ? 'true' : 'false'}\n                data-index={index}\n                {...attributes}\n            >\n                {this.renderIcon(this.config, item)}\n                {this.renderText(item)}\n                {this.renderSubMenuIcon(item)}\n                {this.renderNotification(item)}\n                {this.twoLines && this.avatarList ? this.renderDivider() : null}\n            </li>\n        );\n    };\n\n    /**\n     * Render the text of the list item\n     *\n     * @param item - the list item\n     * @returns the text for the list item\n     */\n    private renderText = (item: MenuItem) => {\n        if (this.isSimpleItem(item)) {\n            return (\n                <span class=\"mdc-deprecated-list-item__text\">{item.text}</span>\n            );\n        }\n\n        return (\n            <div class=\"mdc-deprecated-list-item__text\">\n                <div class=\"mdc-deprecated-list-item__primary-command-text\">\n                    <div class=\"mdc-deprecated-list-item__primary-text\">\n                        {item.text}\n                    </div>\n                    {this.renderCommandText(item)}\n                </div>\n                <div class=\"mdc-deprecated-list-item__secondary-text\">\n                    {item.secondaryText}\n                </div>\n            </div>\n        );\n    };\n\n    private renderSubMenuIcon = (item: MenuItem) => {\n        if (!this.hasSubItems(item)) {\n            return;\n        }\n\n        return <limel-icon class=\"sub-menu-icon\" name=\"-lime-caret-right\" />;\n    };\n\n    private rendertext = (item: ListSeparator) => {\n        if ('text' in item) {\n            return <h2 class=\"limel-list-divider-title\">{item.text}</h2>;\n        }\n    };\n\n    private renderCommandText = (item: MenuItem) => {\n        if (!('commandText' in item)) {\n            return;\n        }\n\n        return (\n            <div class=\"mdc-deprecated-list-item__command-text\">\n                {item.commandText}\n            </div>\n        );\n    };\n\n    private isSimpleItem = (item: MenuItem): boolean => {\n        if ('commandText' in item) {\n            return false;\n        }\n\n        return !('secondaryText' in item);\n    };\n\n    /**\n     * Render an icon for a list item\n     *\n     * @param config - the config object, passed on from the `renderMenuItem` function\n     * @param item - the list item\n     * @returns the icon element\n     */\n    private renderIcon = (config: MenuListRendererConfig, item: MenuItem) => {\n        const style: any = {};\n        const name = getIconName(item.icon);\n        if (!name) {\n            return;\n        }\n\n        const color = getIconColor(item.icon, item.iconColor);\n\n        if (color) {\n            if (config.badgeIcons) {\n                style['--icon-background-color'] = color;\n            } else {\n                style.color = color;\n            }\n        }\n\n        return (\n            <limel-icon\n                badge={config.badgeIcons}\n                class=\"mdc-deprecated-list-item__graphic\"\n                name={name}\n                style={style}\n                size={config.iconSize}\n            />\n        );\n    };\n\n    private renderNotification = (item: MenuItem) => {\n        if (item.badge !== undefined) {\n            return <limel-badge label={item.badge} />;\n        }\n    };\n\n    private renderDivider = () => {\n        const classes = {\n            'mdc-deprecated-list-divider': true,\n            'mdc-deprecated-list-divider--inset': true,\n        };\n        if (this.config.iconSize) {\n            classes[this.config.iconSize] = true;\n        }\n\n        return <hr class={classes} />;\n    };\n\n    private hasSubItems = (item: MenuItem): boolean => {\n        return (\n            (Array.isArray(item.items) && item.items.length > 0) ||\n            isFunction(item.items)\n        );\n    };\n}\n","@use '../../style/functions';\n\n@import '../list/list';\n\n:host(limel-menu-list) {\n    display: block;\n    --badge-background-color: var(\n        --notification-badge-background-color,\n        rgb(var(--color-red-default))\n    );\n    --badge-text-color: var(\n        --notification-badge-text-color,\n        rgb(var(--color-white))\n    );\n}\n\n.mdc-menu {\n    max-height: 70vh; // force tall menus render inside the viewport when menu is at the bottom of the screen\n}\n\n.mdc-deprecated-list {\n    margin: functions.pxToRem(4);\n    // added space to visualize keyboard-focused items\n    .mdc-deprecated-list-item[role='menuitem'] {\n        font-size: functions.pxToRem(13);\n\n        .mdc-deprecated-list-item__graphic {\n            margin-right: functions.pxToRem(14);\n        }\n    }\n\n    hr.mdc-deprecated-list-divider {\n        &.mdc-deprecated-list-divider--inset {\n            display: none;\n        }\n    }\n}\n\nlimel-badge {\n    transform: translateX(0.75rem);\n}\n\n.sub-menu-icon {\n    width: 1rem;\n    transform: translateX(0.75rem);\n    flex-shrink: 0;\n}\n","import { IconSize } from '../icon/icon.types';\nimport { ListSeparator } from '../list/list-item.types';\nimport { MenuItem } from '../menu/menu.types';\nimport { MenuListType } from '../menu-list/menu-list.types';\nimport { MDCMenu, MDCMenuItemEvent } from '@material/menu';\nimport { MDCRipple } from '@material/ripple';\nimport { strings as menuStrings } from '@material/menu/constants';\nimport {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n    Watch,\n} from '@stencil/core';\nimport { MenuListRenderer } from './menu-list-renderer';\nimport { MenuListRendererConfig } from './menu-list-renderer-config';\n\nconst { SELECTED_EVENT } = menuStrings;\n\n/**\n * @private\n */\n@Component({\n    tag: 'limel-menu-list',\n    shadow: true,\n    styleUrl: 'menu-list.scss',\n})\nexport class MenuList {\n    /**\n     * List of items to display\n     */\n    @Prop()\n    public items: Array<MenuItem | ListSeparator>;\n\n    /**\n     * Set to `true` if the list should display larger icons with a background\n     */\n    @Prop()\n    public badgeIcons: boolean;\n\n    /**\n     * Size of the icons in the list\n     */\n    @Prop()\n    public iconSize: IconSize = 'small';\n\n    /**\n     * The type of the menu, omit to get a regular vertical menu.\n     * Available types are:\n     * `menu`: regular vertical menu.\n     */\n    @Prop()\n    public type: MenuListType;\n\n    /**\n     * By default, lists will display 3 lines of text, and then truncate the rest.\n     * Consumers can increase or decrease this number by specifying\n     * `maxLinesSecondaryText`. If consumer enters zero or negative\n     * numbers we default to 1; and if they type decimals we round up.\n     */\n    // eslint-disable-next-line no-magic-numbers\n    @Prop() maxLinesSecondaryText: number = 3;\n\n    @Element()\n    private element: HTMLLimelMenuListElement;\n\n    private config: MenuListRendererConfig;\n    private MenuListRenderer = new MenuListRenderer();\n    private mdcMenu: MDCMenu;\n\n    /**\n     * Fired when a new value has been selected from the list.\n     */\n    @Event()\n    private select: EventEmitter<MenuItem>;\n\n    public connectedCallback() {\n        this.setup();\n    }\n\n    public disconnectedCallback() {\n        this.teardown();\n    }\n\n    public componentDidLoad() {\n        this.setup();\n        this.triggerIconColorWarning();\n    }\n\n    public render() {\n        this.config = {\n            badgeIcons: this.badgeIcons,\n            type: this.type,\n            iconSize: this.iconSize,\n        };\n\n        const html = this.MenuListRenderer.render(this.items, this.config);\n\n        return <div class=\"mdc-menu mdc-menu-surface\">{html}</div>;\n    }\n\n    @Watch('type')\n    protected handleType() {\n        this.setupListeners();\n    }\n\n    @Watch('items')\n    protected itemsChanged() {\n        setTimeout(() => {\n            this.setup();\n        }, 0);\n    }\n\n    private setup = () => {\n        this.setupMenu();\n        this.setupListeners();\n    };\n\n    private setupMenu = () => {\n        if (this.mdcMenu) {\n            this.teardown();\n            this.mdcMenu = null;\n        }\n\n        const element = this.element.shadowRoot.querySelector('.mdc-menu');\n        if (!element) {\n            return;\n        }\n\n        this.mdcMenu = new MDCMenu(element);\n        this.mdcMenu.hasTypeahead = true;\n        this.mdcMenu.wrapFocus = true;\n        this.mdcMenu.items.forEach((item) => new MDCRipple(item));\n    };\n\n    private setupListeners = () => {\n        if (!this.mdcMenu) {\n            return;\n        }\n\n        this.mdcMenu.unlisten(SELECTED_EVENT, this.handleMenuSelect);\n        this.mdcMenu.listen(SELECTED_EVENT, this.handleMenuSelect);\n    };\n\n    private teardown = () => {\n        this.mdcMenu?.unlisten(SELECTED_EVENT, this.handleMenuSelect);\n        this.mdcMenu?.destroy();\n    };\n\n    private handleMenuSelect = (event: MDCMenuItemEvent) => {\n        this.handleSingleSelect(event.detail.index);\n    };\n\n    private handleSingleSelect = (index: number) => {\n        const MenuItems = this.items.filter(this.isMenuItem) as MenuItem[];\n        if (MenuItems[index].disabled) {\n            return;\n        }\n\n        const selectedItem: MenuItem = MenuItems.find((item: MenuItem) => {\n            return !!item.selected;\n        });\n\n        if (selectedItem) {\n            this.select.emit({ ...selectedItem, selected: false });\n        }\n\n        if (MenuItems[index] !== selectedItem) {\n            this.select.emit({ ...MenuItems[index], selected: false });\n        }\n    };\n\n    private isMenuItem = (item: MenuItem): boolean => {\n        return !('separator' in item);\n    };\n\n    private triggerIconColorWarning() {\n        if (this.items.some((item) => 'iconColor' in item)) {\n            /* eslint-disable-next-line no-console */\n            console.warn(\n                \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n            );\n        }\n    }\n}\n"],"mappings":"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"}

package/dist/lime-elements/p-a2b7eea7.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["buttonGroupCss","ButtonGroup","constructor","hostRef","this","radioGroupName","createRandomString","setSelectedButton","selectedButtonId","_a","value","find","button","selected","id","renderButton","bind","onChange","renderContent","componentWillLoad","render","classes","disabled","h","class","role","map","buttonId","isButtonChecked","type","name","checked","htmlFor","renderBadge","icon","renderIcon","renderLabel","title","iconId","size","badge","elementId","label","event","stopPropagation","target","substr","item","change","emit","valueChanged"],"sources":["./src/components/button-group/button-group.scss?tag=limel-button-group&encapsulation=shadow","./src/components/button-group/button-group.tsx"],"sourcesContent":["@use '../../style/internal/z-index';\n@use '../../style/functions';\n@use '../../style/internal/shared_input-select-picker';\n@use '../../style/mixins';\n\n@use '@material/chips/deprecated/mdc-chips';\n/**\n* @prop --button-group-background-color: Background color of the component. Defaults to `--contrast-400`\n*/\n\n.mdc-chip {\n    // As long as this component is depended on MDC,\n    // we need to force it to be font-agnostic.\n    // When MDC-dependency is removed, this block can also be removed.\n    // However, on removal of MDC-dependency, we should also make sure to check\n    // other font-related styles that might be set by MDC,\n    // such as `letter-spacing` or `font-size`.\n    font-family: inherit;\n}\n\n.mdc-chip {\n    @include mixins.is-flat-inset-clickable($background-color: transparent);\n    max-width: 100%;\n    min-width: functions.pxToRem(32);\n    padding: 0 functions.pxToRem(1);\n    display: inline-grid;\n    grid-auto-flow: column;\n    margin: functions.pxToRem(2) !important;\n    font-size: functions.pxToRem(14);\n\n    &:not(:last-child) {\n        &:after {\n            content: '';\n            display: block;\n\n            height: functions.pxToRem(16);\n            width: functions.pxToRem(2);\n            border-radius: functions.pxToRem(4);\n            background-color: var(\n                --button-group-text-color,\n                rgb(var(--contrast-1200))\n            );\n            opacity: 0.1;\n\n            position: absolute;\n            right: functions.pxToRem(-3);\n            top: 0;\n            bottom: 0;\n            margin: auto;\n        }\n    }\n\n    label {\n        cursor: pointer;\n        transition: color 0.2s ease;\n        display: flex;\n        align-items: center;\n        &:has(> limel-badge) {\n            .mdc-chip__text {\n                padding-right: 0.25rem;\n            }\n        }\n    }\n\n    input[type='radio'] {\n        width: 0;\n        position: absolute;\n        opacity: 0; // This removes some visual defects on iOS and Firefox, created by \"user agent styles\"\n\n        &:focus-visible {\n            + label {\n                &:after {\n                    // visualizes keyboard navigation on Chrome & Firefox\n                    // only when non-pointer input is being used,\n                    // e.g. tabbed into using keyboard\n                    content: '';\n                    display: block;\n                    position: absolute;\n                    top: 0;\n                    right: 0;\n                    bottom: 0;\n                    left: 0;\n                    border-radius: functions.pxToRem(60);\n                    box-shadow: var(--shadow-depth-8-focused);\n                    z-index: z-index.$button-group-radio-button-keyboard-focused;\n                }\n            }\n        }\n    }\n\n    span[role='gridcell'] {\n        min-width: 0; // This is needed to force mdc-chip__text (which is inside this span) to truncate\n\n        &:focus-within {\n            // Cannot use `:focus-visible` here, since it is the radio button\n            // which gets focused, which is inside this element…\n            // and we are removing or hiding the visual appearance of the button\n            outline: none;\n            color: var(--mdc-theme-primary);\n        }\n\n        &:only-child {\n            .mdc-chip__text {\n                padding-left: functions.pxToRem(12);\n            }\n        }\n\n        &:first-child {\n            .mdc-chip__text {\n                padding-left: functions.pxToRem(12);\n            }\n        }\n    }\n\n    &.mdc-chip--selected {\n        background-color: var(--mdc-theme-surface);\n        box-shadow: var(--button-shadow-inset);\n\n        &:active {\n            box-shadow: var(--button-shadow-inset-pressed);\n        }\n    }\n}\n\n.mdc-chip__text {\n    font-size: functions.pxToRem(13);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: block;\n    padding: 0 functions.pxToRem(12) 0 functions.pxToRem(4);\n}\n\n.mdc-chip-set {\n    align-items: center;\n    border-radius: functions.pxToRem(60);\n    background-color: var(\n        --button-group-background-color,\n        rgb(var(--contrast-400))\n    );\n    padding: 0;\n\n    width: max-content;\n    max-width: 100%;\n\n    flex-wrap: nowrap; // Not sure about this. It'll put items on one row, but also can look bad on action bars. Kia\n\n    &.disabled {\n        @include shared_input-select-picker.looks-disabled;\n    }\n}\n\nlimel-badge {\n    margin-right: 0.25rem;\n    pointer-events: none;\n}\n\n.mdc-chip:not(.mdc-chip--selected) {\n    --badge-background-color: rgb(var(--contrast-200));\n}\n","import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n    State,\n    Watch,\n} from '@stencil/core';\nimport { Button } from '../button/button.types';\nimport { createRandomString } from '../../util/random-string';\n\n/**\n * A button group control is a linear set of two or more buttons.\n *\n * ## Usage\n *\n * Button groups are often used to display different views of the same thing. A\n * common example of this component is when you switch between [ Map | Transit\n * | Satellite ] views to look at an area on the map.\n *\n * In some cases, button groups may serve as quick filters as well. For example\n * a list of contacts, in which the user can switch to [ All | Favorites\n * | Frequently contacted ] can incorporate a button group to quickly filter out\n * items and display subsets of them.\n *\n * ## Layout\n *\n * The button groups are usually placed in top headers and action bars,\n * sometimes with other elements. Since the group items will always be rendered\n * in a row, you must make sure not to have too many buttons in the group.\n * Because if the container of your button group does not get enough space to\n * fit in all its buttons, they will have to truncate their text and may appear\n * very cramped together. Always think about how your button group will appear\n * on a small screen such as phones.\n * :::note\n * Button can contain text or icons, but not both simultaneously!\n * :::\n *\n * Within the group, icon buttons will all have the same width, while each text button\n * inherits its width from its content.\n *\n * @exampleComponent limel-example-button-group-icons\n * @exampleComponent limel-example-button-group\n * @exampleComponent limel-example-button-group-mix\n * @exampleComponent limel-example-button-group-badges\n * @exampleComponent limel-example-button-group-composite\n */\n@Component({\n    tag: 'limel-button-group',\n    shadow: true,\n    styleUrl: 'button-group.scss',\n})\nexport class ButtonGroup {\n    /**\n     * List of buttons for the group\n     */\n    @Prop()\n    public value: Button[] = [];\n\n    /**\n     * True if the button-group should be disabled\n     */\n    @Prop({ reflect: true })\n    public disabled: boolean = false;\n\n    /**\n     * Dispatched when a button is selected/deselected\n     */\n    @Event()\n    private change: EventEmitter<Button>;\n\n    @State()\n    private selectedButtonId: string;\n\n    private radioGroupName = createRandomString();\n\n    constructor() {\n        this.renderButton = this.renderButton.bind(this);\n        this.onChange = this.onChange.bind(this);\n        this.renderContent = this.renderContent.bind(this);\n    }\n\n    public componentWillLoad() {\n        this.setSelectedButton();\n    }\n\n    public render() {\n        const classes = {\n            'mdc-chip-set': true,\n            disabled: this.disabled,\n            'mdc-chip-set--choice': true,\n        };\n\n        return (\n            <div class={classes} role=\"grid\">\n                {this.value.map(this.renderButton)}\n            </div>\n        );\n    }\n\n    private renderButton(button: Button) {\n        // Prefix with 'b' because html IDs cannot start with a digit,\n        // and we need to differentiate from the ID on the limel-icon. /Ads\n        const buttonId = `b${button.id}`;\n\n        const classes = {\n            'mdc-chip': true,\n            'mdc-chip--selected': this.isButtonChecked(button),\n        };\n\n        return (\n            <div class={classes} role=\"row\">\n                <span role=\"gridcell\">\n                    <input\n                        type=\"radio\"\n                        name={this.radioGroupName}\n                        checked={this.isButtonChecked(button)}\n                        id={buttonId}\n                        onChange={this.onChange}\n                    />\n                    <label htmlFor={buttonId}>\n                        {this.renderContent(button)}\n                        {this.renderBadge(button)}\n                    </label>\n                </span>\n            </div>\n        );\n    }\n\n    private renderContent(button: Button) {\n        if (button.icon) {\n            return this.renderIcon(button);\n        }\n\n        return this.renderLabel(button);\n    }\n\n    private isButtonChecked(button: Button) {\n        return button.id === this.selectedButtonId;\n    }\n\n    private renderLabel(button: Button) {\n        return <span class=\"mdc-chip__text\">{button.title}</span>;\n    }\n\n    private renderIcon(button: Button) {\n        // Prefix with 'i' because html IDs cannot start with a digit,\n        // and we need to differentiate from the \"buttonId\". /Ads\n        const iconId = `i${button.id}`;\n\n        return [\n            <limel-icon\n                id={iconId}\n                class=\"mdc-chip__icon\"\n                aria-label={button.title}\n                name={button.icon}\n                size=\"small\"\n                badge={true}\n            />,\n            <limel-tooltip elementId={iconId} label={button.title} />,\n        ];\n    }\n\n    private renderBadge(button: Button) {\n        if (!button.badge) {\n            return;\n        }\n\n        return <limel-badge label={button.badge} />;\n    }\n\n    private onChange(event: Event) {\n        event.stopPropagation();\n        const target = event.target as HTMLInputElement;\n        // The ID is prefixed with `b` in the HTML, remember? /Ads\n        this.selectedButtonId = target.id.substr(1);\n        const button = this.value.find((item) => {\n            return item.id === this.selectedButtonId;\n        });\n        this.change.emit(button);\n    }\n\n    private setSelectedButton = () => {\n        this.selectedButtonId = this.value.find((button) => {\n            return button.selected;\n        })?.id;\n    };\n\n    @Watch('value')\n    protected valueChanged() {\n        this.setSelectedButton();\n    }\n}\n"],"mappings":"iFAAA,MAAMA,EAAiB,mjlB,MCqDVC,EAAW,MAwBpBC,YAAAC,G,yCAFQC,KAAAC,eAAiBC,IA4GjBF,KAAAG,kBAAoB,K,MACxBH,KAAKI,kBAAmBC,EAAAL,KAAKM,MAAMC,MAAMC,GAC9BA,EAAOC,cAChB,MAAAJ,SAAA,SAAAA,EAAEK,EAAE,E,WAhIe,G,cAME,M,gCAcvBV,KAAKW,aAAeX,KAAKW,aAAaC,KAAKZ,MAC3CA,KAAKa,SAAWb,KAAKa,SAASD,KAAKZ,MACnCA,KAAKc,cAAgBd,KAAKc,cAAcF,KAAKZ,K,CAG1Ce,oBACHf,KAAKG,mB,CAGFa,SACH,MAAMC,EAAU,CACZ,eAAgB,KAChBC,SAAUlB,KAAKkB,SACf,uBAAwB,MAG5B,OACIC,EAAA,OAAKC,MAAOH,EAASI,KAAK,QACrBrB,KAAKM,MAAMgB,IAAItB,KAAKW,c,CAKzBA,aAAaH,GAGjB,MAAMe,EAAW,IAAIf,EAAOE,KAE5B,MAAMO,EAAU,CACZ,WAAY,KACZ,qBAAsBjB,KAAKwB,gBAAgBhB,IAG/C,OACIW,EAAA,OAAKC,MAAOH,EAASI,KAAK,OACtBF,EAAA,QAAME,KAAK,YACPF,EAAA,SACIM,KAAK,QACLC,KAAM1B,KAAKC,eACX0B,QAAS3B,KAAKwB,gBAAgBhB,GAC9BE,GAAIa,EACJV,SAAUb,KAAKa,WAEnBM,EAAA,SAAOS,QAASL,GACXvB,KAAKc,cAAcN,GACnBR,KAAK6B,YAAYrB,K,CAO9BM,cAAcN,GAClB,GAAIA,EAAOsB,KAAM,CACb,OAAO9B,KAAK+B,WAAWvB,E,CAG3B,OAAOR,KAAKgC,YAAYxB,E,CAGpBgB,gBAAgBhB,GACpB,OAAOA,EAAOE,KAAOV,KAAKI,gB,CAGtB4B,YAAYxB,GAChB,OAAOW,EAAA,QAAMC,MAAM,kBAAkBZ,EAAOyB,M,CAGxCF,WAAWvB,GAGf,MAAM0B,EAAS,IAAI1B,EAAOE,KAE1B,MAAO,CACHS,EAAA,cACIT,GAAIwB,EACJd,MAAM,iBAAgB,aACVZ,EAAOyB,MACnBP,KAAMlB,EAAOsB,KACbK,KAAK,QACLC,MAAO,OAEXjB,EAAA,iBAAekB,UAAWH,EAAQI,MAAO9B,EAAOyB,Q,CAIhDJ,YAAYrB,GAChB,IAAKA,EAAO4B,MAAO,CACf,M,CAGJ,OAAOjB,EAAA,eAAamB,MAAO9B,EAAO4B,O,CAG9BvB,SAAS0B,GACbA,EAAMC,kBACN,MAAMC,EAASF,EAAME,OAErBzC,KAAKI,iBAAmBqC,EAAO/B,GAAGgC,OAAO,GACzC,MAAMlC,EAASR,KAAKM,MAAMC,MAAMoC,GACrBA,EAAKjC,KAAOV,KAAKI,mBAE5BJ,KAAK4C,OAAOC,KAAKrC,E,CAUXsC,eACN9C,KAAKG,mB"}

package/dist/lime-elements/p-d7ef9472.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as o,g as e}from"./p-3075aa67.js";import{m as s,r as n}from"./p-fa37036b.js";import{c as a}from"./p-3ccdc4a3.js";const r='@charset "UTF-8";:host([hidden]){display:none}:host([disabled]){pointer-events:none}:host([aria-expanded=true]) button,:host([aria-expanded]:not([aria-expanded=false])) button{box-shadow:var(--button-shadow-inset-pressed) !important}button{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--icon-background-color, transparent);display:inline-flex;align-items:center;justify-content:center;height:2.25rem;width:2.25rem;border-radius:50%}button:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}button:focus{outline:none}button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:host([elevated]) button:not(:hover):not(:active):not(:focus-visible){box-shadow:var(--button-shadow-normal)}button:disabled{color:var(--mdc-theme-text-disabled-on-background)}limel-icon{width:1.25rem}';const i=class{constructor(o){t(this,o);this.tooltipId=a();this.icon=undefined;this.elevated=false;this.label=undefined;this.disabled=false}connectedCallback(){this.initialize()}componentWillLoad(){s(this.host)}disconnectedCallback(){n(this.host)}componentDidLoad(){this.initialize()}initialize(){const t=this.host.shadowRoot.querySelector(".mdc-icon-button");if(!t){return}}render(){const t={};if(this.host.hasAttribute("tabindex")){t.tabindex=this.host.getAttribute("tabindex")}return o("button",Object.assign({disabled:this.disabled,id:this.tooltipId},t),o("limel-icon",{name:this.icon,badge:true}),this.renderTooltip(this.tooltipId))}renderTooltip(t){if(this.label){return o("limel-tooltip",{elementId:t,label:this.label})}}get host(){return e(this)}};i.style=r;export{i as limel_icon_button};
-//# sourceMappingURL=p-d7ef9472.entry.js.map