@limetech/lime-elements 37.2.2 → 37.2.4

package/dist/lime-elements/p-4a8ac53b.entry.js.map

@@ -0,0 +1 @@
+{"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={tooltipId}\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-8be76471.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as o,g as r}from"./p-3075aa67.js";import{m as a,r as n}from"./p-fa37036b.js";const s='@charset "UTF-8";:host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}:host{display:inline-block}:host([hidden]){display:none}:host([aria-expanded=true]) button,:host([aria-expanded]:not([aria-expanded=false])) button{box-shadow:var(--button-shadow-inset-pressed) !important}button.mdc-button{font-family:inherit}button{display:flex;align-items:center;justify-content:center;gap:0.125rem;border:none;border-radius:0.4rem;padding-top:0;padding-right:var(--button-padding-right, 0.5rem);padding-bottom:0;padding-left:var(--button-padding-left, 0.5rem);min-height:2.25rem;width:100%}button:disabled{cursor:not-allowed}button:disabled.outlined{border-color:rgba(var(--contrast-1700), 0.2)}button: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:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}button:not(:disabled):focus{outline:none}button:not(:disabled):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button:not(:disabled):hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button:not(:disabled):active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}:host(limel-button[primary]) button:not(:disabled){color:var(--mdc-theme-on-primary, rgb(var(--color-white)));background-color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}:host(limel-button[primary]) button:disabled{background-color:rgba(var(--contrast-1700), 0.15)}:host(limel-button:not([primary])) button:not(:disabled){color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}:host(limel-button:not([primary])) button:disabled{color:rgba(var(--contrast-1600), 0.37);background-color:rgba(var(--contrast-1600), 0.1)}.icon{width:1.25rem;flex-shrink:0}.label{font-size:0.875rem;font-weight:600;letter-spacing:0.03125rem;padding:0 0.25rem}limel-spinner{position:absolute}limel-icon{vertical-align:top}svg{height:1.875rem;opacity:0;pointer-events:none;position:absolute;width:1.875rem}svg line{stroke:rgb(var(--color-white));stroke-width:2}limel-icon,.label,limel-spinner,svg{transition:opacity 300ms ease-in-out}.loading limel-icon,.loading .label{opacity:0}.loading limel-spinner{opacity:1}.just-loaded limel-icon,.just-loaded .label,.just-failed limel-icon,.just-failed .label{opacity:0}.just-loaded svg,.just-failed svg{opacity:1}.just-failed{background-color:var(--lime-error-text-color) !important;animation:shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both}.outlined{border:1px solid;border-color:var(--mdc-theme-primary)}@keyframes shake{10%,90%{transform:translate3d(-0.0625rem, 0, 0)}20%,80%{transform:translate3d(0.125rem, 0, 0)}30%,50%,70%{transform:translate3d(-0.1875rem, 0, 0)}40%,60%{transform:translate3d(0.1875rem, 0, 0)}}@keyframes reduced-presence{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(0.7)}}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded){animation:reduced-presence 0.3s ease forwards;transition:padding 0.3s ease, min-width 0.3s ease;transition-delay:0.3s;padding:0;min-width:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .label{transition:font-size 0.8s ease;transition-delay:0.3s;font-size:0;opacity:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-icon,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-spinner,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) svg,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .icon{transition:all 0.3s ease;transition-delay:0.3s;opacity:0;width:0;height:0}';const i=class{constructor(t){e(this,t);this.filterClickWhenDisabled=e=>{if(this.disabled){e.preventDefault()}};this.label=undefined;this.primary=false;this.outlined=false;this.icon=undefined;this.disabled=false;this.loading=false;this.loadingFailed=false;this.justLoaded=false}componentWillLoad(){a(this.host)}disconnectedCallback(){n(this.host)}render(){return t(o,{onClick:this.filterClickWhenDisabled},t("button",{class:{loading:this.loading,"just-loaded":this.justLoaded&&!this.loadingFailed,"just-failed":this.justLoaded&&this.loadingFailed,outlined:this.outlined},disabled:this.disabled||this.loading},this.renderIcon(),this.renderLabel(),this.renderSpinner(),t("svg",{viewBox:"0 0 30 30"},this.renderLoadingIcons())))}loadingWatcher(e,t){if(t&&!e){this.justLoaded=true;const e=2e3;this.justLoadedTimeout=window.setTimeout((()=>{this.justLoaded=false}),e)}else if(e){this.justLoaded=false;window.clearTimeout(this.justLoadedTimeout)}}renderLoadingIcons(){if(this.loadingFailed){return[t("line",{x1:"9",y1:"9",x2:"21",y2:"21"}),t("line",{x1:"21",y1:"9",x2:"9",y2:"21"})]}return[t("line",{x1:"8",y1:"14",x2:"15",y2:"20"}),t("line",{x1:"23",y1:"9",x2:"14",y2:"20"})]}renderIcon(){if(!this.icon){return}return t("limel-icon",{class:"icon",name:this.icon})}renderLabel(){if(!this.label){return}return t("span",{class:"label"},this.label)}renderSpinner(){if(!this.loading){return}return t("limel-spinner",{limeBranded:false})}get host(){return r(this)}static get watchers(){return{loading:["loadingWatcher"]}}};i.style=s;export{i as limel_button};
+//# sourceMappingURL=p-8be76471.entry.js.map

package/dist/lime-elements/p-8be76471.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["buttonCss","Button","this","filterClickWhenDisabled","e","disabled","preventDefault","componentWillLoad","makeEnterClickable","host","disconnectedCallback","removeEnterClickable","render","h","Host","onClick","class","loading","justLoaded","loadingFailed","outlined","renderIcon","renderLabel","renderSpinner","viewBox","renderLoadingIcons","loadingWatcher","newValue","oldValue","TIMEOUT","justLoadedTimeout","window","setTimeout","clearTimeout","x1","y1","x2","y2","icon","name","label","limeBranded"],"sources":["./src/components/button/button.scss?tag=limel-button&encapsulation=shadow","./src/components/button/button.tsx"],"sourcesContent":["@use '../../style/functions';\n@use '../../style/mixins';\n\n@use '../../style/internal/lime-theme';\n\n:host {\n    display: inline-block;\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n@include mixins.visualize-aria-expanded('button');\n\nbutton.mdc-button {\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\nbutton {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 0.125rem;\n\n    border: none;\n    border-radius: 0.4rem;\n    padding: {\n        top: 0;\n        right: var(--button-padding-right, 0.5rem);\n        bottom: 0;\n        left: var(--button-padding-left, 0.5rem);\n    }\n\n    min-height: 2.25rem;\n    width: 100%;\n\n    &:disabled {\n        cursor: not-allowed;\n\n        &.outlined {\n            border-color: rgba(var(--contrast-1700), 0.2);\n        }\n    }\n\n    &:not(:disabled) {\n        @include mixins.visualize-keyboard-focus;\n        @include mixins.is-elevated-clickable();\n    }\n\n    :host(limel-button[primary]) & {\n        &:not(:disabled) {\n            color: var(--mdc-theme-on-primary, rgb(var(--color-white)));\n            background-color: var(\n                --mdc-theme-primary,\n                rgb(var(--color-teal-default))\n            );\n        }\n        &:disabled {\n            background-color: rgba(var(--contrast-1700), 0.15);\n        }\n    }\n\n    :host(limel-button:not([primary])) & {\n        &:not(:disabled) {\n            color: var(--mdc-theme-primary, rgb(var(--color-teal-default)));\n        }\n        &:disabled {\n            color: rgba(var(--contrast-1600), 0.37);\n            background-color: rgba(var(--contrast-1600), 0.1);\n        }\n    }\n}\n\n.icon {\n    width: 1.25rem;\n    flex-shrink: 0;\n}\n\n.label {\n    font-size: 0.875rem;\n    font-weight: 600;\n    letter-spacing: functions.pxToRem(0.5);\n    padding: 0 0.25rem;\n}\n\nlimel-spinner {\n    position: absolute;\n}\n\nlimel-icon {\n    vertical-align: top;\n}\n\nsvg {\n    height: functions.pxToRem(30);\n    opacity: 0;\n    pointer-events: none;\n    position: absolute;\n    width: functions.pxToRem(30);\n\n    line {\n        stroke: rgb(var(--color-white));\n        stroke-width: 2;\n    }\n}\n\nlimel-icon,\n.label,\nlimel-spinner,\nsvg {\n    transition: opacity 300ms ease-in-out;\n}\n\n.loading {\n    limel-icon,\n    .label {\n        opacity: 0;\n    }\n    limel-spinner {\n        opacity: 1;\n    }\n}\n\n.just-loaded,\n.just-failed {\n    limel-icon,\n    .label {\n        opacity: 0;\n    }\n    svg {\n        opacity: 1;\n    }\n}\n\n.just-failed {\n    background-color: var(--lime-error-text-color) !important;\n    animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n}\n\n.outlined {\n    border: 1px solid;\n    border-color: var(--mdc-theme-primary);\n}\n\n@keyframes shake {\n    10%,\n    90% {\n        transform: translate3d(#{functions.pxToRem(-1)}, 0, 0);\n    }\n\n    20%,\n    80% {\n        transform: translate3d(#{functions.pxToRem(2)}, 0, 0);\n    }\n\n    30%,\n    50%,\n    70% {\n        transform: translate3d(#{functions.pxToRem(-3)}, 0, 0);\n    }\n\n    40%,\n    60% {\n        transform: translate3d(#{functions.pxToRem(3)}, 0, 0);\n    }\n}\n\n@import './partial-styles/_has-reduced-presence';\n","import { Component, h, Prop, State, Watch, Element, Host } from '@stencil/core';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../util/make-enter-clickable';\n\n/**\n * @exampleComponent limel-example-button-basic\n * @exampleComponent limel-example-button-primary\n * @exampleComponent limel-example-button-outlined\n * @exampleComponent limel-example-button-disabled\n * @exampleComponent limel-example-button-icon\n * @exampleComponent limel-example-button-loading\n * @exampleComponent limel-example-button-click-success\n * @exampleComponent limel-example-button-click-fail\n * @exampleComponent limel-example-button-reduce-presence\n * @exampleComponent limel-example-button-colors\n * @exampleComponent limel-example-button-composite\n */\n@Component({\n    tag: 'limel-button',\n    shadow: true,\n    styleUrl: 'button.scss',\n})\nexport class Button {\n    /**\n     * The text to show on 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 to `true` to make the button outlined.\n     */\n    @Prop({ reflect: true })\n    public outlined = 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     * Set to `true` to put the button in the `loading` state.\n     * This also disables the button.\n     */\n    @Prop({ reflect: true })\n    public loading = false;\n\n    /**\n     * Set to `true` to indicate failure instead of success when the button is\n     * no longer in the `loading` state.\n     */\n    @Prop({ reflect: true })\n    public loadingFailed = false;\n\n    @State()\n    private justLoaded = false;\n\n    @Element()\n    private host: HTMLElement;\n\n    private justLoadedTimeout?: number;\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public render() {\n        return (\n            <Host onClick={this.filterClickWhenDisabled}>\n                <button\n                    class={{\n                        loading: this.loading,\n                        'just-loaded': this.justLoaded && !this.loadingFailed,\n                        'just-failed': this.justLoaded && this.loadingFailed,\n                        outlined: this.outlined,\n                    }}\n                    disabled={this.disabled || this.loading}\n                >\n                    {this.renderIcon()}\n                    {this.renderLabel()}\n                    {this.renderSpinner()}\n                    <svg viewBox=\"0 0 30 30\">{this.renderLoadingIcons()}</svg>\n                </button>\n            </Host>\n        );\n    }\n\n    @Watch('loading')\n    protected loadingWatcher(newValue: boolean, oldValue: boolean) {\n        if (oldValue && !newValue) {\n            this.justLoaded = true;\n            const TIMEOUT = 2000;\n            this.justLoadedTimeout = window.setTimeout(() => {\n                this.justLoaded = false;\n            }, TIMEOUT);\n        } else if (newValue) {\n            this.justLoaded = false;\n            window.clearTimeout(this.justLoadedTimeout);\n        }\n    }\n\n    private renderLoadingIcons() {\n        if (this.loadingFailed) {\n            return [\n                <line x1=\"9\" y1=\"9\" x2=\"21\" y2=\"21\" />,\n                <line x1=\"21\" y1=\"9\" x2=\"9\" y2=\"21\" />,\n            ];\n        }\n\n        return [\n            <line x1=\"8\" y1=\"14\" x2=\"15\" y2=\"20\" />,\n            <line x1=\"23\" y1=\"9\" x2=\"14\" y2=\"20\" />,\n        ];\n    }\n\n    private renderIcon() {\n        if (!this.icon) {\n            return;\n        }\n\n        return <limel-icon class=\"icon\" name={this.icon} />;\n    }\n\n    private renderLabel() {\n        if (!this.label) {\n            return;\n        }\n\n        return <span class=\"label\">{this.label}</span>;\n    }\n\n    private renderSpinner() {\n        if (!this.loading) {\n            return;\n        }\n\n        return <limel-spinner limeBranded={false} />;\n    }\n\n    private filterClickWhenDisabled = (e) => {\n        if (this.disabled) {\n            e.preventDefault();\n        }\n    };\n}\n"],"mappings":"oGAAA,MAAMA,EAAY,y0J,MCwBLC,EAAM,M,yBAsIPC,KAAAC,wBAA2BC,IAC/B,GAAIF,KAAKG,SAAU,CACfD,EAAEE,gB,qCA7HO,M,cAMC,M,kCAYA,M,aAOD,M,mBAOM,M,gBAGF,K,CAOdC,oBACHC,EAAmBN,KAAKO,K,CAGrBC,uBACHC,EAAqBT,KAAKO,K,CAGvBG,SACH,OACIC,EAACC,EAAI,CAACC,QAASb,KAAKC,yBAChBU,EAAA,UACIG,MAAO,CACHC,QAASf,KAAKe,QACd,cAAef,KAAKgB,aAAehB,KAAKiB,cACxC,cAAejB,KAAKgB,YAAchB,KAAKiB,cACvCC,SAAUlB,KAAKkB,UAEnBf,SAAUH,KAAKG,UAAYH,KAAKe,SAE/Bf,KAAKmB,aACLnB,KAAKoB,cACLpB,KAAKqB,gBACNV,EAAA,OAAKW,QAAQ,aAAatB,KAAKuB,uB,CAOrCC,eAAeC,EAAmBC,GACxC,GAAIA,IAAaD,EAAU,CACvBzB,KAAKgB,WAAa,KAClB,MAAMW,EAAU,IAChB3B,KAAK4B,kBAAoBC,OAAOC,YAAW,KACvC9B,KAAKgB,WAAa,KAAK,GACxBW,E,MACA,GAAIF,EAAU,CACjBzB,KAAKgB,WAAa,MAClBa,OAAOE,aAAa/B,KAAK4B,kB,EAIzBL,qBACJ,GAAIvB,KAAKiB,cAAe,CACpB,MAAO,CACHN,EAAA,QAAMqB,GAAG,IAAIC,GAAG,IAAIC,GAAG,KAAKC,GAAG,OAC/BxB,EAAA,QAAMqB,GAAG,KAAKC,GAAG,IAAIC,GAAG,IAAIC,GAAG,O,CAIvC,MAAO,CACHxB,EAAA,QAAMqB,GAAG,IAAIC,GAAG,KAAKC,GAAG,KAAKC,GAAG,OAChCxB,EAAA,QAAMqB,GAAG,KAAKC,GAAG,IAAIC,GAAG,KAAKC,GAAG,O,CAIhChB,aACJ,IAAKnB,KAAKoC,KAAM,CACZ,M,CAGJ,OAAOzB,EAAA,cAAYG,MAAM,OAAOuB,KAAMrC,KAAKoC,M,CAGvChB,cACJ,IAAKpB,KAAKsC,MAAO,CACb,M,CAGJ,OAAO3B,EAAA,QAAMG,MAAM,SAASd,KAAKsC,M,CAG7BjB,gBACJ,IAAKrB,KAAKe,QAAS,CACf,M,CAGJ,OAAOJ,EAAA,iBAAe4B,YAAa,O"}

package/dist/lime-elements/{p-a2b7eea7.entry.js → p-9928ba36.entry.js}

@@ -1,2 +1,2 @@
-import{r as i,c,h as e}from"./p-3075aa67.js";import{c as r}from"./p-3ccdc4a3.js";const t='@charset "UTF-8";:host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}.mdc-touch-target-wrapper{display:inline}.mdc-deprecated-chip-trailing-action__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-deprecated-chip-trailing-action{border:none;display:inline-flex;position:relative;align-items:center;justify-content:center;box-sizing:border-box;padding:0;outline:none;cursor:pointer;-webkit-appearance:none;background:none}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__touch{width:26px}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__icon{fill:currentColor;color:inherit}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-deprecated-chip-trailing-action{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--unbounded .mdc-deprecated-chip-trailing-action__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--foreground-activation .mdc-deprecated-chip-trailing-action__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--foreground-deactivation .mdc-deprecated-chip-trailing-action__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, var(--mdc-theme-on-surface, #000))}.mdc-deprecated-chip-trailing-action:hover .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action.mdc-ripple-surface--hover .mdc-deprecated-chip-trailing-action__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--background-focused .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded):focus .mdc-deprecated-chip-trailing-action__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded) .mdc-deprecated-chip-trailing-action__ripple::after{transition:opacity 150ms linear}.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded):active .mdc-deprecated-chip-trailing-action__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple{position:absolute;box-sizing:content-box;width:100%;height:100%;overflow:hidden}.mdc-chip__icon--leading{color:rgba(0, 0, 0, 0.54)}.mdc-deprecated-chip-trailing-action{color:#000}.mdc-chip__icon--trailing{color:rgba(0, 0, 0, 0.54)}.mdc-chip__icon--trailing:hover{color:rgba(0, 0, 0, 0.62)}.mdc-chip__icon--trailing:focus{color:rgba(0, 0, 0, 0.87)}.mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px;}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px;}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}.mdc-chip{border-radius:16px;background-color:#e0e0e0;color:rgba(0, 0, 0, 0.87);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, inherit));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip:hover{color:rgba(0, 0, 0, 0.87)}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px;}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip:hover{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{transition:opacity 75ms cubic-bezier(0.4, 0, 0.2, 1), width 150ms cubic-bezier(0, 0, 0.2, 1), padding 100ms linear, margin 100ms linear;opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__icon--leading{color:rgba(38, 166, 154, 0.54)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:hover{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip .mdc-chip__checkmark-path{stroke:#26a69a;stroke:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip--selected{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}.mdc-chip{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-chip .mdc-chip__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-chip .mdc-chip__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-chip.mdc-ripple-upgraded--unbounded .mdc-chip__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-chip.mdc-ripple-upgraded--foreground-activation .mdc-chip__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-chip.mdc-ripple-upgraded--foreground-deactivation .mdc-chip__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{background-color:rgba(0, 0, 0, 0.87);background-color:var(--mdc-ripple-color, rgba(0, 0, 0, 0.87))}.mdc-chip:hover .mdc-chip__ripple::before,.mdc-chip.mdc-ripple-surface--hover .mdc-chip__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-chip.mdc-ripple-upgraded--background-focused .mdc-chip__ripple::before,.mdc-chip.mdc-ripple-upgraded:focus-within .mdc-chip__ripple::before,.mdc-chip:not(.mdc-ripple-upgraded):focus .mdc-chip__ripple::before,.mdc-chip:not(.mdc-ripple-upgraded):focus-within .mdc-chip__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-chip:not(.mdc-ripple-upgraded) .mdc-chip__ripple::after{transition:opacity 150ms linear}.mdc-chip:not(.mdc-ripple-upgraded):active .mdc-chip__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-chip.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-chip .mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::before{opacity:0.16;opacity:var(--mdc-ripple-selected-opacity, 0.16)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:hover .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-surface--hover .mdc-chip__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-hover-opacity, 0.24)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded--background-focused .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded:focus-within .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):focus .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):focus-within .mdc-chip__ripple::before{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-focus-opacity, 0.4)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded) .mdc-chip__ripple::after{transition:opacity 150ms linear}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):active .mdc-chip__ripple::after{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-press-opacity, 0.4)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.4)}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:0.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mdc-chip{font-family:inherit}.mdc-chip{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:transparent;max-width:100%;min-width:2rem;padding:0 0.0625rem;display:inline-grid;grid-auto-flow:column;margin:0.125rem !important;font-size:0.875rem}.mdc-chip:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}.mdc-chip:active{background-color:var(--mdc-theme-surface);box-shadow:var(--button-shadow-inset-pressed);transform:translate3d(0, 0.05rem, 0)}.mdc-chip:not(:last-child):after{content:"";display:block;height:1rem;width:0.125rem;border-radius:0.25rem;background-color:var(--button-group-text-color, rgb(var(--contrast-1200)));opacity:0.1;position:absolute;right:-0.1875rem;top:0;bottom:0;margin:auto}.mdc-chip label{cursor:pointer;transition:color 0.2s ease;display:flex;align-items:center}.mdc-chip label:has(>limel-badge) .mdc-chip__text{padding-right:0.25rem}.mdc-chip input[type=radio]{width:0;position:absolute;opacity:0}.mdc-chip input[type=radio]:focus-visible+label:after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3.75rem;box-shadow:var(--shadow-depth-8-focused);z-index:1}.mdc-chip span[role=gridcell]{min-width:0}.mdc-chip span[role=gridcell]:focus-within{outline:none;color:var(--mdc-theme-primary)}.mdc-chip span[role=gridcell]:only-child .mdc-chip__text{padding-left:0.75rem}.mdc-chip span[role=gridcell]:first-child .mdc-chip__text{padding-left:0.75rem}.mdc-chip.mdc-chip--selected{background-color:var(--mdc-theme-surface);box-shadow:var(--button-shadow-inset)}.mdc-chip.mdc-chip--selected:active{box-shadow:var(--button-shadow-inset-pressed)}.mdc-chip__text{font-size:0.8125rem;overflow:hidden;text-overflow:ellipsis;display:block;padding:0 0.75rem 0 0.25rem}.mdc-chip-set{align-items:center;border-radius:3.75rem;background-color:var(--button-group-background-color, rgb(var(--contrast-400)));padding:0;width:max-content;max-width:100%;flex-wrap:nowrap}.mdc-chip-set.disabled{cursor:not-allowed;pointer-events:none;opacity:0.4}limel-badge{margin-right:0.25rem;pointer-events:none}.mdc-chip:not(.mdc-chip--selected){--badge-background-color:rgb(var(--contrast-200))}';const p=class{constructor(e){i(this,e);this.change=c(this,"change",7);this.radioGroupName=r();this.setSelectedButton=()=>{var i;this.selectedButtonId=(i=this.value.find((i=>i.selected)))===null||i===void 0?void 0:i.id};this.value=[];this.disabled=false;this.selectedButtonId=undefined;this.renderButton=this.renderButton.bind(this);this.onChange=this.onChange.bind(this);this.renderContent=this.renderContent.bind(this)}componentWillLoad(){this.setSelectedButton()}render(){const i={"mdc-chip-set":true,disabled:this.disabled,"mdc-chip-set--choice":true};return e("div",{class:i,role:"grid"},this.value.map(this.renderButton))}renderButton(i){const c=`b${i.id}`;const r={"mdc-chip":true,"mdc-chip--selected":this.isButtonChecked(i)};return e("div",{class:r,role:"row"},e("span",{role:"gridcell"},e("input",{type:"radio",name:this.radioGroupName,checked:this.isButtonChecked(i),id:c,onChange:this.onChange}),e("label",{htmlFor:c},this.renderContent(i),this.renderBadge(i))))}renderContent(i){if(i.icon){return this.renderIcon(i)}return this.renderLabel(i)}isButtonChecked(i){return i.id===this.selectedButtonId}renderLabel(i){return e("span",{class:"mdc-chip__text"},i.title)}renderIcon(i){const c=`i${i.id}`;return[e("limel-icon",{id:c,class:"mdc-chip__icon","aria-label":i.title,name:i.icon,size:"small",badge:true}),e("limel-tooltip",{elementId:c,label:i.title})]}renderBadge(i){if(!i.badge){return}return e("limel-badge",{label:i.badge})}onChange(i){i.stopPropagation();const c=i.target;this.selectedButtonId=c.id.substr(1);const e=this.value.find((i=>i.id===this.selectedButtonId));this.change.emit(e)}valueChanged(){this.setSelectedButton()}static get watchers(){return{value:["valueChanged"]}}};p.style=t;export{p as limel_button_group};
-//# sourceMappingURL=p-a2b7eea7.entry.js.map
+import{r as i,c,h as e}from"./p-3075aa67.js";import{c as r}from"./p-3ccdc4a3.js";const t='@charset "UTF-8";:host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}.mdc-touch-target-wrapper{display:inline}.mdc-deprecated-chip-trailing-action__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-deprecated-chip-trailing-action{border:none;display:inline-flex;position:relative;align-items:center;justify-content:center;box-sizing:border-box;padding:0;outline:none;cursor:pointer;-webkit-appearance:none;background:none}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__touch{width:26px}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__icon{fill:currentColor;color:inherit}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-deprecated-chip-trailing-action{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--unbounded .mdc-deprecated-chip-trailing-action__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--foreground-activation .mdc-deprecated-chip-trailing-action__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--foreground-deactivation .mdc-deprecated-chip-trailing-action__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, var(--mdc-theme-on-surface, #000))}.mdc-deprecated-chip-trailing-action:hover .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action.mdc-ripple-surface--hover .mdc-deprecated-chip-trailing-action__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--background-focused .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded):focus .mdc-deprecated-chip-trailing-action__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded) .mdc-deprecated-chip-trailing-action__ripple::after{transition:opacity 150ms linear}.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded):active .mdc-deprecated-chip-trailing-action__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple{position:absolute;box-sizing:content-box;width:100%;height:100%;overflow:hidden}.mdc-chip__icon--leading{color:rgba(0, 0, 0, 0.54)}.mdc-deprecated-chip-trailing-action{color:#000}.mdc-chip__icon--trailing{color:rgba(0, 0, 0, 0.54)}.mdc-chip__icon--trailing:hover{color:rgba(0, 0, 0, 0.62)}.mdc-chip__icon--trailing:focus{color:rgba(0, 0, 0, 0.87)}.mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px;}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px;}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}.mdc-chip{border-radius:16px;background-color:#e0e0e0;color:rgba(0, 0, 0, 0.87);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, inherit));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip:hover{color:rgba(0, 0, 0, 0.87)}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px;}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip:hover{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{transition:opacity 75ms cubic-bezier(0.4, 0, 0.2, 1), width 150ms cubic-bezier(0, 0, 0.2, 1), padding 100ms linear, margin 100ms linear;opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__icon--leading{color:rgba(38, 166, 154, 0.54)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:hover{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip .mdc-chip__checkmark-path{stroke:#26a69a;stroke:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip--selected{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}.mdc-chip{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-chip .mdc-chip__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-chip .mdc-chip__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-chip.mdc-ripple-upgraded--unbounded .mdc-chip__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-chip.mdc-ripple-upgraded--foreground-activation .mdc-chip__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-chip.mdc-ripple-upgraded--foreground-deactivation .mdc-chip__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{background-color:rgba(0, 0, 0, 0.87);background-color:var(--mdc-ripple-color, rgba(0, 0, 0, 0.87))}.mdc-chip:hover .mdc-chip__ripple::before,.mdc-chip.mdc-ripple-surface--hover .mdc-chip__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-chip.mdc-ripple-upgraded--background-focused .mdc-chip__ripple::before,.mdc-chip.mdc-ripple-upgraded:focus-within .mdc-chip__ripple::before,.mdc-chip:not(.mdc-ripple-upgraded):focus .mdc-chip__ripple::before,.mdc-chip:not(.mdc-ripple-upgraded):focus-within .mdc-chip__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-chip:not(.mdc-ripple-upgraded) .mdc-chip__ripple::after{transition:opacity 150ms linear}.mdc-chip:not(.mdc-ripple-upgraded):active .mdc-chip__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-chip.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-chip .mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::before{opacity:0.16;opacity:var(--mdc-ripple-selected-opacity, 0.16)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:hover .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-surface--hover .mdc-chip__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-hover-opacity, 0.24)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded--background-focused .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded:focus-within .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):focus .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):focus-within .mdc-chip__ripple::before{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-focus-opacity, 0.4)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded) .mdc-chip__ripple::after{transition:opacity 150ms linear}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):active .mdc-chip__ripple::after{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-press-opacity, 0.4)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.4)}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:0.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mdc-chip{font-family:inherit}.mdc-chip{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:transparent;max-width:100%;min-width:2rem;padding:0 0.0625rem;display:inline-grid;grid-auto-flow:column;margin:0.125rem !important;font-size:0.875rem}.mdc-chip:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}.mdc-chip:active{background-color:var(--mdc-theme-surface);box-shadow:var(--button-shadow-inset-pressed);transform:translate3d(0, 0.05rem, 0)}.mdc-chip:not(:last-child):after{content:"";display:block;height:1rem;width:0.125rem;border-radius:0.25rem;background-color:var(--button-group-text-color, rgb(var(--contrast-1200)));opacity:0.1;position:absolute;right:-0.1875rem;top:0;bottom:0;margin:auto}.mdc-chip label{cursor:pointer;transition:color 0.2s ease;display:flex;align-items:center}.mdc-chip label:has(>limel-badge) .mdc-chip__text{padding-right:0.25rem}.mdc-chip input[type=radio]{width:0;position:absolute;opacity:0}.mdc-chip input[type=radio]:focus-visible+label:after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3.75rem;box-shadow:var(--shadow-depth-8-focused);z-index:1}.mdc-chip span[role=gridcell]{min-width:0}.mdc-chip span[role=gridcell]:focus-within{outline:none;color:var(--mdc-theme-primary)}.mdc-chip span[role=gridcell]:only-child .mdc-chip__text{padding-left:0.75rem}.mdc-chip span[role=gridcell]:first-child .mdc-chip__text{padding-left:0.75rem}.mdc-chip.mdc-chip--selected{background-color:var(--mdc-theme-surface);box-shadow:var(--button-shadow-inset)}.mdc-chip.mdc-chip--selected:active{box-shadow:var(--button-shadow-inset-pressed)}.mdc-chip__text{font-size:0.8125rem;overflow:hidden;text-overflow:ellipsis;display:block;padding:0 0.75rem 0 0.25rem}.mdc-chip-set{align-items:center;border-radius:3.75rem;background-color:var(--button-group-background-color, rgb(var(--contrast-400)));padding:0;width:max-content;max-width:100%;flex-wrap:nowrap}.mdc-chip-set.disabled{cursor:not-allowed;opacity:0.4;pointer-events:none}limel-badge{margin-right:0.25rem;pointer-events:none}.mdc-chip:not(.mdc-chip--selected){--badge-background-color:rgb(var(--contrast-200))}';const p=class{constructor(e){i(this,e);this.change=c(this,"change",7);this.radioGroupName=r();this.setSelectedButton=()=>{var i;this.selectedButtonId=(i=this.value.find((i=>i.selected)))===null||i===void 0?void 0:i.id};this.value=[];this.disabled=false;this.selectedButtonId=undefined;this.renderButton=this.renderButton.bind(this);this.onChange=this.onChange.bind(this);this.renderContent=this.renderContent.bind(this)}componentWillLoad(){this.setSelectedButton()}render(){const i={"mdc-chip-set":true,disabled:this.disabled,"mdc-chip-set--choice":true};return e("div",{class:i,role:"grid"},this.value.map(this.renderButton))}renderButton(i){const c=`b${i.id}`;const r={"mdc-chip":true,"mdc-chip--selected":this.isButtonChecked(i)};return e("div",{class:r,role:"row"},e("span",{role:"gridcell"},e("input",{type:"radio",name:this.radioGroupName,checked:this.isButtonChecked(i),id:c,onChange:this.onChange}),e("label",{htmlFor:c},this.renderContent(i),this.renderBadge(i))))}renderContent(i){if(i.icon){return this.renderIcon(i)}return this.renderLabel(i)}isButtonChecked(i){return i.id===this.selectedButtonId}renderLabel(i){return e("span",{class:"mdc-chip__text"},i.title)}renderIcon(i){const c=`i${i.id}`;return[e("limel-icon",{id:c,class:"mdc-chip__icon","aria-label":i.title,name:i.icon,size:"small",badge:true}),e("limel-tooltip",{elementId:c,label:i.title})]}renderBadge(i){if(!i.badge){return}return e("limel-badge",{label:i.badge})}onChange(i){i.stopPropagation();const c=i.target;this.selectedButtonId=c.id.substr(1);const e=this.value.find((i=>i.id===this.selectedButtonId));this.change.emit(e)}valueChanged(){this.setSelectedButton()}static get watchers(){return{value:["valueChanged"]}}};p.style=t;export{p as limel_button_group};
+//# sourceMappingURL=p-9928ba36.entry.js.map

package/dist/lime-elements/p-9928ba36.entry.js.map

@@ -0,0 +1 @@
+{"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        pointer-events: none;\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"}