@luzmo/lucero 1.0.1-alpha.9 → 1.0.2

package/components/menu-DAA51y45.cjs

@@ -0,0 +1,108 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 Luzmo
+ * All rights reserved.
+ * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
+ * This license allows users with a current active Luzmo account to use Lucero.
+ * This license terminates automatically if a user no longer has an active Luzmo account.
+ * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ * */
+require(`./chunk-D-qHiVGv.cjs`);const e=require(`./decorate-B2wePfNm.cjs`),t=require(`./sized-mixin-StFA4y0J.cjs`),n=require(`./focusable-CupEoHmn.cjs`),r=require(`./like-anchor-BZJXts_H.cjs`),i=require(`./observe-slot-text-BhTcGuHY.cjs`),a=require(`./random-id-B51lUxUB.cjs`),o=require(`./observe-slot-presence-Dx8hzNzK.cjs`),s=require(`./slottable-request-event-gAcEQan2.cjs`),c=require(`./dependency-manger-CHy9t__e.cjs`),l=require(`./divider.module-CL60P_z8.cjs`);let u=require(`lit`),d=require(`lit/decorators.js`),f=require(`@luzmo/icons`),p=require(`@lit-labs/observers/mutation-controller.js`);var m=`:host{--menu-item-top-to-action:var(--luzmo-spacing-1);--menu-item-top-to-checkbox:var(--luzmo-spacing-1);--menu-item-label-line-height:var(--luzmo-line-height);--menu-item-label-line-height-cjk:1.5;--menu-item-label-to-description-spacing:1px;--menu-item-focus-indicator-width:var(--luzmo-indicator-width);--menu-item-focus-indicator-color:var(--luzmo-indicator-color);--menu-item-label-to-value-area-min-spacing:var(--luzmo-spacing-3);--menu-item-label-content-color-default:var(--luzmo-font-color);--menu-item-label-content-color-hover:var(--luzmo-font-color-hover);--menu-item-label-content-color-down:var(--luzmo-font-color-down);--menu-item-label-content-color-focus:var(--luzmo-font-color-focus);--menu-item-highlight-label-background-color:var(--luzmo-primary);--menu-item-highlight-label-content-color:var(--luzmo-font-color);--menu-item-highlight-label-content-color-hover:var(--luzmo-font-color-hover);--menu-item-highlight-label-content-color-down:var(--luzmo-font-color-down);--menu-item-highlight-label-content-color-focus:var(--luzmo-font-color-focus);--menu-item-label-icon-color-default:var(--luzmo-font-color);--menu-item-label-icon-color-hover:var(--luzmo-font-color-hover);--menu-item-label-icon-color-down:var(--luzmo-font-color-down);--menu-item-label-icon-color-focus:var(--luzmo-font-color-focus);--menu-item-label-content-color-disabled:var(--luzmo-font-color-disabled);--menu-item-label-icon-color-disabled:var(--luzmo-font-color-disabled);--menu-item-description-line-height:var(--luzmo-line-height);--menu-item-description-line-height-cjk:1.5;--menu-item-description-color-default:var(--luzmo-font-color);--menu-item-description-color-hover:var(--luzmo-font-color-hover);--menu-item-description-color-down:var(--luzmo-font-color-down);--menu-item-description-color-focus:var(--luzmo-font-color-focus);--menu-item-description-color-disabled:var(--luzmo-disabled-color);--menu-section-header-line-height:var(--luzmo-line-height);--menu-section-header-line-height-cjk:1.5;--menu-section-header-font-weight:bold;--menu-section-header-color:var(--luzmo-font-color-down);--menu-collapsible-icon-color:var(--luzmo-font-color-down);--menu-checkmark-icon-color-default:var(--luzmo-primary);--menu-checkmark-icon-color-hover:var(--luzmo-primary-hover);--menu-checkmark-icon-color-down:var(--luzmo-primary-down);--menu-checkmark-icon-color-focus:var(--luzmo-primary-focus);--menu-drillin-icon-color-default:var(--luzmo-font-color);--menu-drillin-icon-color-hover:var(--luzmo-font-color-hover);--menu-drillin-icon-color-down:var(--luzmo-font-color-down);--menu-drillin-icon-color-focus:var(--luzmo-font-color-focus);--menu-item-value-color-default:var(--luzmo-font-color);--menu-item-value-color-hover:var(--luzmo-font-color-hover);--menu-item-value-color-down:var(--luzmo-font-color-down);--menu-item-value-color-focus:var(--luzmo-font-color-focus);--menu-checkmark-display-hidden:none;--menu-checkmark-display-shown:block;--menu-checkmark-display:block;--menu-item-collapsible-no-icon-submenu-item-padding-x-start:28px;--menu-item-background-color-selected:var(--luzmo-background-color);--menu-item-background-color-default:var(--luzmo-background-color);--menu-item-background-color-hover:var(--luzmo-background-color-hover);--menu-item-background-color-down:var(--luzmo-background-color-down);--menu-item-background-color-key-focus:var(--luzmo-background-color-focus);--menu-item-min-height:var(--luzmo-component-height);--menu-max-height:calc(8 * var(--menu-item-min-height));--menu-item-icon-height:var(--luzmo-font-size);--menu-item-icon-width:var(--luzmo-font-size);--menu-item-label-font-size:var(--luzmo-font-size);--menu-item-label-text-to-visual:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-label-inline-edge-to-content:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-top-edge-to-text:var(--luzmo-spacing-1);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-1);--menu-item-text-to-control:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-description-font-size:var(--luzmo-font-size-xs);--menu-section-header-font-size:var(--luzmo-font-size);--menu-section-header-min-width:var(--luzmo-component-height);--menu-item-selectable-edge-to-text-not-selected:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-checkmark-size:var(--luzmo-font-size-xs);--menu-item-angle-size:var(--luzmo-font-size);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-back-icon-margin:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=s]){--menu-item-min-height:var(--luzmo-component-height-s);--menu-item-icon-height:var(--luzmo-font-size-s);--menu-item-icon-width:var(--luzmo-font-size-s);--menu-item-label-font-size:var(--luzmo-font-size-s);--menu-item-label-text-to-visual:var(--luzmo-spacing-3);--menu-item-label-inline-edge-to-content:var(--luzmo-spacing-3);--menu-item-top-edge-to-text:var(--luzmo-spacing-1);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-1);--menu-item-text-to-control:var(--luzmo-spacing-2);--menu-item-description-font-size:var(--luzmo-font-size-xs);--menu-section-header-font-size:var(--luzmo-font-size-s);--menu-section-header-min-width:var(--luzmo-component-height-s);--menu-item-selectable-edge-to-text-not-selected:var(--luzmo-spacing-3);--menu-item-checkmark-size:var(--luzmo-font-size-xs);--menu-item-angle-size:var(--luzmo-font-size-s);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:var(--luzmo-spacing-3);--menu-back-icon-margin:var(--luzmo-spacing-3)}:host([size=l]){--menu-item-min-height:var(--luzmo-component-height-l);--menu-item-icon-height:var(--luzmo-font-size-l);--menu-item-icon-width:var(--luzmo-font-size-l);--menu-item-label-font-size:var(--luzmo-font-size-l);--menu-item-label-text-to-visual:var(--luzmo-spacing-4);--menu-item-label-inline-edge-to-content:var(--luzmo-spacing-4);--menu-item-top-edge-to-text:var(--luzmo-spacing-2);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-2);--menu-item-text-to-control:var(--luzmo-spacing-3);--menu-item-description-font-size:var(--luzmo-font-size-s);--menu-section-header-font-size:var(--luzmo-font-size-l);--menu-section-header-min-width:var(--luzmo-component-height-l);--menu-item-selectable-edge-to-text-not-selected:var(--luzmo-spacing-4);--menu-item-checkmark-size:var(--luzmo-font-size-s);--menu-item-angle-size:var(--luzmo-font-size-l);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:var(--luzmo-spacing-4);--menu-back-icon-margin:var(--luzmo-spacing-4)}:host([size=xl]){--menu-item-min-height:var(--luzmo-component-height-xl);--menu-item-icon-height:var(--luzmo-font-size-xl);--menu-item-icon-width:var(--luzmo-font-size-xl);--menu-item-label-font-size:var(--luzmo-font-size-xl);--menu-item-label-text-to-visual:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-item-label-inline-edge-to-content:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-item-top-edge-to-text:var(--luzmo-spacing-2);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-2);--menu-item-text-to-control:var(--luzmo-spacing-4);--menu-item-description-font-size:var(--luzmo-font-size);--menu-section-header-font-size:var(--luzmo-font-size-xl);--menu-section-header-min-width:var(--luzmo-component-height-xl);--menu-item-selectable-edge-to-text-not-selected:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-item-checkmark-size:var(--luzmo-font-size);--menu-item-angle-size:var(--luzmo-font-size-xl);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-back-icon-margin:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1))}:host([variant=highlight]){--menu-item-highlight-label-content-color:var(--luzmo-primary-inverse-color);--menu-checkmark-display:var(--menu-checkmark-display-hidden);--menu-item-highlight-label-content-color-hover:var(--luzmo-primary-inverse-color);--menu-item-highlight-label-content-color-down:var(--luzmo-primary-inverse-color);--menu-item-highlight-label-content-color-focus:var(--luzmo-primary-inverse-color)}:host([variant=highlight]) ::slotted(luzmo-menu-item[selected]){background-color:var(--luzmo-menu-item-highlight-label-background-color,var(--menu-item-highlight-label-background-color,var(--luzmo-border-color)));padding-inline-start:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content))}@media (forced-colors:active){:host{--highcontrast-menu-item-background-color-default:ButtonFace;--highcontrast-menu-item-color-default:ButtonText;--highcontrast-menu-item-background-color-focus:Highlight;--highcontrast-menu-item-color-focus:HighlightText;--highcontrast-menu-checkmark-icon-color-default:Highlight;--highcontrast-menu-item-color-disabled:GrayText;--highcontrast-menu-item-focus-indicator-color:Highlight;--highcontrast-menu-item-selected-background-color:Highlight;--highcontrast-menu-item-selected-color:HighlightText}@supports (color:SelectedItem){:host{--highcontrast-menu-item-selected-background-color:SelectedItem;--highcontrast-menu-item-selected-color:SelectedItemText}}}:host{inline-size:auto;inline-size:var(--luzmo-menu-inline-size,auto);box-sizing:border-box;max-height:var(--luzmo-menu-max-height,var(--menu-max-height));margin:0;padding:0;list-style-type:none;display:inline-block;overflow:auto}:host:lang(ja),:host:lang(ko),:host:lang(zh){--menu-item-label-line-height:var(--luzmo-menu-item-label-line-height-cjk,var(--menu-item-label-line-height-cjk));--menu-item-description-line-height:var(--luzmo-menu-item-description-line-height-cjk,var(--menu-item-description-line-height-cjk));--menu-section-header-line-height:var(--luzmo-menu-section-header-line-height-cjk,var(--menu-section-header-line-height-cjk))}:host([selects]) ::slotted(luzmo-menu-item){--menu-checkmark-display:var(--menu-checkmark-display-hidden);padding-inline-start:var(--luzmo-menu-item-selectable-edge-to-text-not-selected,var(--menu-item-selectable-edge-to-text-not-selected))}:host([selects]) ::slotted(luzmo-menu-item[selected]){--menu-checkmark-display:var(--menu-checkmark-display-shown);padding-inline-start:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content))}.luzmo-Menu-backIcon{margin-block:var(--luzmo-menu-back-icon-margin-block,var(--menu-back-icon-margin));margin-inline:var(--luzmo-menu-back-icon-margin-inline,var(--menu-back-icon-margin));fill:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-icon-color-default,var(--menu-section-header-color)));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-icon-color-default,var(--menu-section-header-color)))}.luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.luzmo-Menu-sectionHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-section-header-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));min-inline-size:var(--luzmo-menu-section-header-min-width,var(--menu-section-header-min-width));padding-block-start:var(--luzmo-menu-section-header-top-edge-to-text,var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));padding-block-end:var(--luzmo-menu-section-header-bottom-edge-to-text,var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text)));padding-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));grid-area:sectionHeadingArea/1/sectionHeadingArea/-1;display:block}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-back .luzmo-Menu-sectionHeading{padding:0}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}.luzmo-Menu-backButton:focus-visible{outline:var(--luzmo-indicator-width) solid var(--luzmo-indicator-color);outline-offset:calc((var(--luzmo-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{flex-direction:column;width:100%;display:inline-flex}:host(:focus){outline:none}::slotted(*){flex-shrink:0}`;function h(e,t){return!!t&&(e===t||e.contains(t))}var g=class extends t.n(e.n,{noDefaultSize:!0}){static get styles(){return[(0,u.unsafeCSS)(m)]}get isSubmenu(){return this.slot===`submenu`}get selected(){return this._selected}set selected(e){if(e===this.selected)return;let t=this.selected;this._selected=e,this.selectedItems=[],this.selectedItemsMap.clear(),this.childItems.forEach(e=>{this===e.menuData.selectionRoot&&(e.selected=this.selected.includes(e.value),e.selected&&(this.selectedItems.push(e),this.selectedItemsMap.set(e,!0)))}),this.requestUpdate(`selected`,t)}get childItems(){return this.cachedChildItems||=this.updateCachedMenuItems(),this.cachedChildItems}get childRole(){if(this.resolvedRole===`listbox`)return`option`;switch(this.resolvedSelects){case`single`:return`menuitemradio`;case`multiple`:return`menuitemcheckbox`;default:return`menuitem`}}get ownRole(){return`menu`}constructor(){super(),this.label=``,this.ignore=!1,this.value=``,this.valueSeparator=`,`,this.selectedItems=[],this.focusedItemIndex=0,this.focusInItemIndex=0,this._selected=[],this.cacheUpdated=Promise.resolve(),this.childItemSet=new Set,this.selectedItemsMap=new Map,this._hasUpdatedSelectedItemIndex=!1,this._willUpdateItems=!1,this.pointerUpTarget=null,this.descendentOverlays=new Map,this.handleSubmenuClosed=e=>{e.stopPropagation(),e.composedPath()[0].dispatchEvent(new Event(`luzmo-menu-submenu-closed`,{bubbles:!0,composed:!0}))},this.handleSubmenuOpened=e=>{e.stopPropagation(),e.composedPath()[0].dispatchEvent(new Event(`luzmo-menu-submenu-opened`,{bubbles:!0,composed:!0}));let t=this.childItems[this.focusedItemIndex];t&&(t.focused=!1);let n=e.composedPath().find(e=>this.childItemSet.has(e));if(!n)return;let r=this.childItems.indexOf(n);this.focusedItemIndex=r,this.focusInItemIndex=r},this.resolveCacheUpdated=()=>{},this.addEventListener(`luzmo-menu-item-added-or-updated`,this.onSelectableItemAddedOrUpdated),this.addEventListener(`luzmo-menu-item-added-or-updated`,this.onFocusableItemAddedOrUpdated,{capture:!0}),this.addEventListener(`click`,this.handleClick),this.addEventListener(`pointerup`,this.handlePointerup),this.addEventListener(`focusin`,this.handleFocusin),this.addEventListener(`blur`,this.handleBlur),this.addEventListener(`luzmo-opened`,this.handleSubmenuOpened),this.addEventListener(`luzmo-closed`,this.handleSubmenuClosed)}focus({preventScroll:e}={}){if(this.childItems.every(e=>e.disabled))return;if(this.childItems.some(e=>e.menuData.focusRoot!==this)){super.focus({preventScroll:e});return}this.focusMenuItemByOffset(0),super.focus({preventScroll:e});let t=this.selectedItems[0];t&&!e&&t.scrollIntoView({block:`nearest`})}handleFocusin(e){if(this.childItems.some(e=>e.menuData.focusRoot!==this))return;let t=this.getRootNode().activeElement,n=this.childItems[this.focusedItemIndex]?.menuData.selectionRoot||this;if((t!==n||e.target!==this)&&(n.focus({preventScroll:!0}),t&&this.focusedItemIndex===0)){let e=this.childItems.indexOf(t);this.focusMenuItemByOffset(Math.max(e,0))}this.startListeningToKeyboard()}startListeningToKeyboard(){this.addEventListener(`keydown`,this.handleKeydown)}handleBlur(e){h(this,e.relatedTarget)||(this.stopListeningToKeyboard(),this.childItems.forEach(e=>e.focused=!1),this.removeAttribute(`aria-activedescendant`))}stopListeningToKeyboard(){this.removeEventListener(`keydown`,this.handleKeydown)}selectOrToggleItem(e){let t=this.resolvedSelects,n=new Map(this.selectedItemsMap),r=[...this.selected],i=[...this.selectedItems],a=this.value,o=this.childItems[this.focusedItemIndex];if(o&&(o.focused=!1,o.active=!1),this.focusedItemIndex=this.childItems.indexOf(e),this.forwardFocusVisibleToItem(e),t===`multiple`){this.selectedItemsMap.has(e)?this.selectedItemsMap.delete(e):this.selectedItemsMap.set(e,!0);let t=[],n=[];this.childItemSet.forEach(e=>{e.menuData.selectionRoot===this&&this.selectedItemsMap.has(e)&&(t.push(e.value),n.push(e))}),this._selected=t,this.selectedItems=n,this.value=this.selected.join(this.valueSeparator)}else this.selectedItemsMap.clear(),this.selectedItemsMap.set(e,!0),this.value=e.value,this._selected=[e.value],this.selectedItems=[e];if(!this.dispatchEvent(new Event(`change`,{cancelable:!0,bubbles:!0,composed:!0}))){this._selected=r,this.selectedItems=i,this.selectedItemsMap=n,this.value=a;return}if(t===`single`){for(let t of n.keys())t!==e&&(t.selected=!1);e.selected=!0}else t===`multiple`?e.selected=!e.selected:!e.hasSubmenu&&e?.menuData?.focusRoot===this&&this.dispatchEvent(new Event(`close`,{bubbles:!0}))}handleKeydown(e){if(e.defaultPrevented)return;let t=this.childItems[this.focusedItemIndex];t&&(t.focused=!0);let{key:n}=e;if(e.shiftKey&&e.target!==this&&this.hasAttribute(`tabindex`)){this.removeAttribute(`tabindex`);let e=t=>{!t.shiftKey&&!this.hasAttribute(`tabindex`)&&(this.tabIndex=0,document.removeEventListener(`keyup`,e),this.removeEventListener(`focusout`,e))};document.addEventListener(`keyup`,e),this.addEventListener(`focusout`,e)}if(n===`Tab`){this.prepareToCleanUp();return}if(n===` `&&t?.hasSubmenu){t.openOverlay();return}if(n===` `||n===`Enter`){let t=this.childItems[this.focusedItemIndex];t&&t.menuData.selectionRoot===e.target&&(e.preventDefault(),t.click());return}if(n===`ArrowDown`||n===`ArrowUp`){let t=this.childItems[this.focusedItemIndex];t&&t.menuData.selectionRoot===e.target&&this.navigateWithinMenu(e);return}if(n===`Home`||n===`End`){let t=this.childItems[this.focusedItemIndex];if(t&&t.menuData.selectionRoot===e.target){e.preventDefault(),e.stopPropagation();let t=this.childItems[this.focusedItemIndex];t&&(t.focused=!1,t.active=t.open),this.focusedItemIndex=n===`Home`?this.childItems.length-1:0,this.focusMenuItemByOffset(n===`Home`?1:-1).scrollIntoView({block:`nearest`})}return}if(n.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey){this.handleTypeahead(e);return}this.navigateBetweenRelatedMenus(e)}focusMenuItemByOffset(e){let t=e||1,n=this.childItems[this.focusedItemIndex];n&&(n.focused=!1,n.active=n.open),this.focusedItemIndex=(this.childItems.length+this.focusedItemIndex+e)%this.childItems.length;let r=this.childItems[this.focusedItemIndex],i=this.childItems.length;for(;r?.disabled&&i;)--i,this.focusedItemIndex=(this.childItems.length+this.focusedItemIndex+t)%this.childItems.length,r=this.childItems[this.focusedItemIndex];return r?.disabled||this.forwardFocusVisibleToItem(r),r}updateSelectedItemIndex(){let e=0,t=new Map,n=[],r=[],i=this.childItems.length;for(;i;){--i;let a=this.childItems[i];a.menuData.selectionRoot===this&&((a.selected||!this._hasUpdatedSelectedItemIndex&&this.selected.includes(a.value))&&(e=i,t.set(a,!0),n.unshift(a.value),r.unshift(a)),i!==e&&(a.focused=!1))}r.map((e,t)=>{t>0&&(e.focused=!1)}),this.selectedItemsMap=t,this._selected=n,this.selectedItems=r,this.value=this.selected.join(this.valueSeparator),this.focusedItemIndex=e,this.focusInItemIndex=e}closeDescendentOverlays(){this.descendentOverlays.forEach(e=>{e.open=!1}),this.descendentOverlays=new Map}render(){return this.renderMenuItemSlot()}connectedCallback(){super.connectedCallback(),!this.hasAttribute(`role`)&&!this.ignore&&this.setAttribute(`role`,this.ownRole),this.updateComplete.then(()=>this.updateItemFocus())}disconnectedCallback(){this.cachedChildItems=void 0,this.selectedItems=[],this.selectedItemsMap.clear(),this.childItemSet.clear(),this.descendentOverlays=new Map,super.disconnectedCallback()}handleDescendentOverlayOpened(e){let t=e.composedPath()[0];t.overlayElement&&this.descendentOverlays.set(t.overlayElement,t.overlayElement)}handleDescendentOverlayClosed(e){let t=e.composedPath()[0];t.overlayElement&&this.descendentOverlays.delete(t.overlayElement)}navigateWithinMenu(e){let{key:t}=e,n=this.childItems[this.focusedItemIndex],r=t===`ArrowDown`?1:-1,i=this.focusMenuItemByOffset(r);i!==n&&(e.preventDefault(),e.stopPropagation(),i.scrollIntoView({block:`nearest`}))}handleTypeahead(e){let{key:t}=e;e.preventDefault(),e.stopPropagation();let n=t.toLowerCase(),r=this.focusedItemIndex+1,i=this.childItems;for(let e=0;e<i.length;e++){let t=(r+e)%i.length,a=i[t],o=(a.textContent||``).trim().toLowerCase();if(!a.disabled&&o.startsWith(n)){let e=this.childItems[this.focusedItemIndex];e&&(e.focused=!1,e.active=e.open),this.focusedItemIndex=i.length+t-1,this.focusMenuItemByOffset(1).scrollIntoView({block:`nearest`});break}}}navigateBetweenRelatedMenus(e){let{key:t}=e,n=this.isLTR&&t===`ArrowRight`||!this.isLTR&&t===`ArrowLeft`,r=this.isLTR&&t===`ArrowLeft`||!this.isLTR&&t===`ArrowRight`||t===`Escape`;if(n){let t=this.childItems[this.focusedItemIndex];t?.hasSubmenu&&(e.stopPropagation(),t.openOverlay())}else r&&this.isSubmenu&&(e.stopPropagation(),this.dispatchEvent(new Event(`close`,{bubbles:!0})),this.updateSelectedItemIndex())}renderMenuItemSlot(){return u.html`
+      <slot
+        @luzmo-menu-submenu-opened=${this.handleDescendentOverlayOpened}
+        @luzmo-menu-submenu-closed=${this.handleDescendentOverlayClosed}
+        @slotchange=${this.handleSlotchange}
+      ></slot>
+    `}firstUpdated(e){if(super.firstUpdated(e),!this.hasAttribute(`tabindex`)&&!this.ignore){let e=this.getAttribute(`role`);this.tabIndex=e===`group`?-1:0}let t=[new Promise(e=>requestAnimationFrame(()=>e(!0)))];[...this.children].forEach(e=>{e.localName===`luzmo-menu-item`&&t.push(e.updateComplete)}),this.childItemsUpdated=Promise.all(t)}updated(e){super.updated(e),e.has(`selects`)&&this.hasUpdated&&this.selectsChanged(),e.has(`label`)&&(this.label||e.get(`label`)!==void 0)&&(this.label?this.setAttribute(`aria-label`,this.label):this.removeAttribute(`aria-label`))}selectsChanged(){let e=[new Promise(e=>requestAnimationFrame(()=>e(!0)))];this.childItemSet.forEach(t=>{e.push(t.triggerUpdate())}),this.childItemsUpdated=Promise.all(e)}async getUpdateComplete(){let e=await super.getUpdateComplete();return await this.childItemsUpdated,await this.cacheUpdated,e}updateCachedMenuItems(){if(this.cachedChildItems=[],!this.menuSlot)return[];let e=this.menuSlot.assignedElements({flatten:!0});for(let[t,n]of e.entries()){if(this.childItemSet.has(n)){this.cachedChildItems.push(n);continue}let r=n.localName===`slot`?n.assignedElements({flatten:!0}):[...n.querySelectorAll(`:scope > *`)];e.splice(t,1,n,...r)}return this.cachedChildItems}onFocusableItemAddedOrUpdated(e){e.menuCascade.set(this,{hadFocusRoot:!!e.item.menuData.focusRoot,ancestorWithSelects:e.currentAncestorWithSelects}),this.selects&&(e.currentAncestorWithSelects=this),e.item.menuData.focusRoot=e.item.menuData.focusRoot||this}onSelectableItemAddedOrUpdated(e){let t=e.menuCascade.get(this);if(!t)return;if(e.item.menuData.parentMenu=e.item.menuData.parentMenu||this,t.hadFocusRoot&&!this.ignore&&(this.tabIndex=-1),this.addChildItem(e.item),this.selects===`inherit`){this.resolvedSelects=`inherit`;let t=e.currentAncestorWithSelects?.ignore;this.resolvedRole=t?`none`:e.currentAncestorWithSelects?.getAttribute(`role`)||this.getAttribute(`role`)||void 0}else this.selects?(this.resolvedRole=this.ignore?`none`:this.getAttribute(`role`)||void 0,this.resolvedSelects=this.selects):(this.resolvedRole=this.ignore?`none`:this.getAttribute(`role`)||void 0,this.resolvedSelects=this.resolvedRole===`none`?`ignore`:`none`);let n=this.resolvedSelects===`single`||this.resolvedSelects===`multiple`;e.item.menuData.cleanupSteps.push(e=>this.removeChildItem(e)),(n||!this.selects&&this.resolvedSelects!==`ignore`)&&!e.item.menuData.selectionRoot&&(e.item.setRole(this.childRole),e.item.menuData.selectionRoot=e.item.menuData.selectionRoot||this,e.item.selected&&(this.selectedItemsMap.set(e.item,!0),this.selectedItems=[...this.selectedItems,e.item],this._selected=[...this.selected,e.item.value],this.value=this.selected.join(this.valueSeparator)))}addChildItem(e){this.childItemSet.add(e),this.handleItemsChanged()}async removeChildItem(e){this.childItemSet.delete(e),this.cachedChildItems=void 0,e.focused&&(this.handleItemsChanged(),await this.updateComplete,this.focus())}handleClick(e){if(this.pointerUpTarget===e.target){this.pointerUpTarget=null;return}this.handlePointerBasedSelection(e)}handlePointerup(e){this.pointerUpTarget=e.target,this.handlePointerBasedSelection(e)}handlePointerBasedSelection(e){if(e instanceof MouseEvent&&e.button!==0)return;let t=e.composedPath().find(e=>e instanceof Element?e.getAttribute(`role`)===this.childRole:!1);if(e.defaultPrevented){let e=this.childItems.indexOf(t);t?.menuData?.focusRoot===this&&e!==-1&&(this.focusedItemIndex=e);return}if(t?.href&&t.href.length>0){this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0}));return}else if(t?.menuData?.selectionRoot===this&&this.childItems.length>0){if(e.preventDefault(),t.hasSubmenu||t.open)return;this.selectOrToggleItem(t)}else return;this.prepareToCleanUp()}prepareToCleanUp(){document.addEventListener(`focusout`,()=>{requestAnimationFrame(()=>{let e=this.childItems[this.focusedItemIndex];e&&(e.focused=!1,this.updateSelectedItemIndex())})},{once:!0})}handleItemsChanged(){this.cachedChildItems=void 0,this._willUpdateItems||(this._willUpdateItems=!0,this.cacheUpdated=this.updateCache())}async updateCache(){await(this.hasUpdated?new Promise(e=>requestAnimationFrame(()=>e(!0))):Promise.all([new Promise(e=>requestAnimationFrame(()=>e(!0))),this.updateComplete])),this.cachedChildItems===void 0&&(this.updateSelectedItemIndex(),this.updateItemFocus()),this._willUpdateItems=!1}updateItemFocus(){if(this.childItems.length===0)return;let e=this.childItems[this.focusInItemIndex];this.getRootNode().activeElement===e.menuData.focusRoot&&this.forwardFocusVisibleToItem(e)}forwardFocusVisibleToItem(e){!e||e.menuData.focusRoot!==this||(this.closeDescendentOverlays(),e.focused=this.hasVisibleFocusInTree()||!!this.childItems.some(e=>e.hasVisibleFocusInTree()),this.setAttribute(`aria-activedescendant`,e.id),e.menuData.selectionRoot&&e.menuData.selectionRoot!==this&&e.menuData.selectionRoot.focus())}handleSlotchange({target:e}){let t=e.assignedElements({flatten:!0});this.childItems.length!==t.length&&t.forEach(e=>{e.triggerUpdate===void 0?e.childItems!==void 0&&e.childItems.forEach(e=>{e.triggerUpdate()}):e.triggerUpdate()})}};e.t([(0,d.property)({type:String,reflect:!0})],g.prototype,`label`,void 0),e.t([(0,d.property)({type:Boolean,reflect:!0})],g.prototype,`ignore`,void 0),e.t([(0,d.property)({type:String,reflect:!0})],g.prototype,`variant`,void 0),e.t([(0,d.property)({type:String,reflect:!0})],g.prototype,`selects`,void 0),e.t([(0,d.property)({type:String})],g.prototype,`value`,void 0),e.t([(0,d.property)({type:String,attribute:`value-separator`})],g.prototype,`valueSeparator`,void 0),e.t([(0,d.property)({attribute:!1})],g.prototype,`selected`,null),e.t([(0,d.property)({attribute:!1})],g.prototype,`selectedItems`,void 0),e.t([(0,d.query)(`slot:not([name])`)],g.prototype,`menuSlot`,void 0);var _=`:host{--menu-divider-thickness:var(--divider-thickness-medium,var(--luzmo-border-width));inline-size:auto;margin-block:var(--luzmo-menu-section-divider-margin-block,max(0px, (var(--menu-item-section-divider-height) - var(--menu-divider-thickness)) / 2));margin-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));overflow:visible}.luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}.luzmo-Menu-backButton:focus-visible{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{flex-shrink:0;display:block}`,v=class extends t.n(e.n,{validSizes:[`s`,`m`,`l`]}){static get styles(){return[(0,u.unsafeCSS)(l.t),(0,u.unsafeCSS)(_)]}firstUpdated(e){super.firstUpdated(e),this.setAttribute(`role`,`separator`)}},y=`.luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.header{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-section-header-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));min-inline-size:var(--luzmo-menu-section-header-min-width,var(--menu-section-header-min-width));padding-block-start:var(--luzmo-menu-section-header-top-edge-to-text,var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));padding-block-end:var(--luzmo-menu-section-header-bottom-edge-to-text,var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text)));padding-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));grid-area:sectionHeadingArea/1/sectionHeadingArea/-1;display:block}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-back .header{padding:0}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}.luzmo-Menu-backButton:focus-visible{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{flex-direction:column;margin:0;display:inline-flex;overflow:visible}[hidden]{display:none!important}`,b=class extends g{constructor(...e){super(...e),this.headerId=``}static get styles(){return[...super.styles,(0,u.unsafeCSS)(y)]}render(){return u.html`
+      <span class="header" ?hidden=${!this.headerElement}>
+        <slot name="header" @slotchange=${this.updateLabel}></slot>
+      </span>
+      <luzmo-menu
+        size=${this.size}
+        .variant=${this.variant}
+        .selects=${this.selects}
+        ignore
+        >${this.renderMenuItemSlot()}</luzmo-menu
+      >
+    `}get ownRole(){switch(this.selects){case`multiple`:case`single`:case`inherit`:return`group`;default:return`menu`}}updateLabel(){let e=this.headerElements.length>0?this.headerElements[0]:void 0;if(e!==this.headerElement)if(this.headerElement&&this.headerElement.id===this.headerId&&this.headerElement.removeAttribute(`id`),e){this.headerId=this.headerId||`luzmo-menu-group-label-${a.t()}`;let t=e.id||this.headerId;e.id||=t,this.setAttribute(`aria-labelledby`,t)}else this.removeAttribute(`aria-labelledby`);this.headerElement=e}};e.t([(0,d.queryAssignedNodes)({slot:`header`,flatten:!0})],b.prototype,`headerElements`,void 0),e.t([(0,d.state)()],b.prototype,`headerElement`,void 0);var x=`.checkmark{display:var(--luzmo-menu-checkmark-display,var(--menu-checkmark-display));font-size:var(--luzmo-menu-item-checkmark-size,var(--menu-item-checkmark-size));fill:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-default,var(--menu-checkmark-icon-color-default)));color:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-default,var(--menu-checkmark-icon-color-default)));opacity:1;grid-area:checkmarkArea;align-self:start;margin-block-start:calc(var(--luzmo-menu-item-top-to-checkmark,var(--menu-item-top-to-checkmark)) - var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));margin-inline-end:var(--luzmo-menu-item-text-to-control,var(--menu-item-text-to-control))}.angle{font-size:var(--menu-item-angle-size);grid-area:angleArea;align-self:center;margin-inline-end:var(--luzmo-menu-item-text-to-control,var(--menu-item-text-to-control))}.luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.luzmo-Menu-backButton:focus-visible{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}::slotted([slot=icon]){fill:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-icon-color-default,var(--menu-item-label-icon-color-default)));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-icon-color-default,var(--menu-item-label-icon-color-default)));block-size:var(--luzmo-menu-item-icon-size,var(--menu-item-icon-height));inline-size:var(--luzmo-menu-item-icon-width,var(--menu-item-icon-height));font-size:var(--luzmo-menu-item-icon-size,var(--menu-item-icon-height));text-align:center;--luzmo-icon-vertical-align:0;grid-area:iconArea;align-self:start;margin-block-start:var(--luzmo-menu-item-top-to-icon,var(--menu-item-top-to-icon));margin-inline-end:var(--luzmo-menu-item-label-text-to-visual,var(--menu-item-label-text-to-visual))}:host{cursor:pointer;box-sizing:border-box;background-color:var(--highcontrast-menu-item-background-color-default,var(--luzmo-menu-item-background-color-default,var(--menu-item-background-color-default)));line-height:var(--luzmo-menu-item-label-line-height,var(--menu-item-label-line-height));min-block-size:var(--luzmo-menu-item-min-height,var(--menu-item-min-height));padding-block-start:var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text));padding-block-end:var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text));padding-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));grid-template:".angleAreaCollapsible.headingIconArea sectionHeadingArea. . .""selectedArea angleAreaCollapsible checkmarkArea iconArea labelArea valueArea actionsArea angleAreaDrillIn"1fr". . . .descriptionArea. . ."". . . .submenuArea. . ."". . . . . . . ."/auto auto auto auto 1fr auto auto auto;justify-content:start;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:grid;position:relative}.luzmo-Menu-itemCheckbox{--luzmo-checkbox-top-to-text:0;--luzmo-checkbox-text-to-control:0;min-block-size:0}.luzmo-Menu-itemCheckbox .luzmo-Checkbox-box{margin-block-start:var(--luzmo-menu-item-top-to-checkbox,var(--menu-item-top-to-checkbox));margin-block-end:0;margin-inline-end:var(--luzmo-menu-item-text-to-control,var(--menu-item-text-to-control))}.luzmo-Menu-itemSwitch{min-block-size:0}.luzmo-Menu-itemSwitch .luzmo-Switch-switch{margin-block-start:var(--luzmo-menu-item-top-to-action,var(--menu-item-top-to-action));margin-block-end:0}#label{grid-area:submenuItemLabelArea}::slotted([slot=value]){grid-area:submenuItemValueArea}:host([focused]),:host(:focus){background-color:var(--highcontrast-menu-item-background-color-focus,var(--luzmo-menu-item-background-color-key-focus,var(--menu-item-background-color-key-focus)));outline:none}:host([focused])>#label,:host(:focus)>#label,:host([focused])>.menu-item-tooltip-icon,:host(:focus)>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-content-color-focus,var(--menu-item-label-content-color-focus)))}:host([focused])>[name=description]::slotted(*),:host(:focus)>[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-description-color-focus,var(--menu-item-description-color-focus)))}:host([focused])>::slotted([slot=value]),:host(:focus)>::slotted([slot=value]){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-value-color-focus,var(--menu-item-value-color-focus)))}:host([focused])>.icon:not(.angle,.checkmark),:host(:focus)>.icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-focus,var(--menu-item-label-icon-color-focus)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-focus,var(--menu-item-label-icon-color-focus)))}:host([focused])>.angle,:host(:focus)>.angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)))}:host([focused])>.checkmark,:host(:focus)>.checkmark{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-focus,var(--menu-checkmark-icon-color-focus)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-focus,var(--menu-checkmark-icon-color-focus)))}:is(:host:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl])){--menu-item-focus-indicator-direction-scalar:-1}:host(:is(:active,[active])){background-color:var(--highcontrast-menu-item-background-color-focus,var(--luzmo-menu-item-background-color-down,var(--menu-item-background-color-down)))}:host(:is(:active,[active]))>#label,:host(:is(:active,[active]))>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-content-color-down,var(--menu-item-label-content-color-down)))}:host(:is(:active,[active]))>[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-description-color-down,var(--menu-item-description-color-down)))}:host(:is(:active,[active]))>::slotted([slot=value]){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-value-color-down,var(--menu-item-value-color-down)))}:host(:is(:active,[active]))>.icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-down,var(--menu-item-label-icon-color-down)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-down,var(--menu-item-label-icon-color-down)))}:host(:is(:active,[active]))>.angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)))}:host(:is(:active,[active]))>.checkmark{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-down,var(--menu-checkmark-icon-color-down)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-down,var(--menu-checkmark-icon-color-down)))}:host([disabled]),:host([aria-disabled=true]){background-color:initial}:host([disabled]) #label,:host([disabled]) .menu-item-tooltip-icon,:host([disabled]) ::slotted([slot=value]),:host([aria-disabled=true]) #label,:host([aria-disabled=true]) ::slotted([slot=value]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-content-color-disabled,var(--menu-item-label-content-color-disabled)))}:host([disabled]) [name=description]::slotted(*),:host([aria-disabled=true]) [name=description]::slotted(*){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-description-color-disabled,var(--menu-item-description-color-disabled)))}:host([disabled]) ::slotted([slot=icon]),:host([aria-disabled=true]) ::slotted([slot=icon]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)));fill:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)))}:host([focused]) .luzmo-Menu-back,:host([focused]){box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}:host .is-selectableMultiple{align-items:start}.is-selectableMultiple .luzmo-Menu-itemCheckbox{grid-area:checkmarkArea}.luzmo-Menu-itemSelection{grid-area:selectedArea}#label{--luzmo-switch-control-label-spacing:0;--luzmo-switch-spacing-top-to-label:0;font-size:var(--luzmo-menu-item-label-font-size,var(--menu-item-label-font-size));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-content-color-default,var(--menu-item-label-content-color-default)));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;grid-area:labelArea}.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-icon-color-default,var(--menu-item-label-icon-color-default)))}:host([selected]) #label,:host([selected]) .menu-item-tooltip-icon{color:var(--menu-item-highlight-label-content-color)}::slotted([slot=value]){color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-value-color-default,var(--menu-item-value-color-default)));font-size:var(--luzmo-menu-item-label-font-size,var(--menu-item-label-font-size));grid-area:valueArea;justify-self:end}.luzmo-Menu-itemActions,::slotted([slot=value]){align-self:start;margin-inline-start:var(--luzmo-menu-item-label-to-value-area-min-spacing,var(--menu-item-label-to-value-area-min-spacing))}.luzmo-Menu-itemActions{grid-area:actionsArea}[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-description-color-default,var(--menu-item-description-color-default)));font-size:var(--luzmo-menu-item-description-font-size,var(--menu-item-description-font-size));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;line-height:var(--luzmo-menu-item-description-line-height,var(--menu-item-description-line-height));grid-area:descriptionArea;margin-block-start:var(--luzmo-menu-item-label-to-description-spacing,var(--menu-item-label-to-description-spacing))}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.luzmo-Menu-item--collapsible.is-open{padding-block-end:0}.luzmo-Menu-item--collapsible.is-open .angle{transform:rotate(90deg)}:host([focused]) .luzmo-Menu-item--collapsible.is-open,:host(:is(:active,[active])) .luzmo-Menu-item--collapsible.is-open,.luzmo-Menu-item--collapsible.is-open:focus{background-color:var(--highcontrast-menu-item-background-color-default,var(--luzmo-menu-item-background-color-default,var(--menu-item-background-color-default)))}.luzmo-Menu-item--collapsible ::slotted([slot=icon]){grid-area:headingIconArea}.luzmo-Menu-item--collapsible>::slotted([slot=icon]){padding-block-start:var(--luzmo-menu-section-header-top-edge-to-text,var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));padding-block-end:var(--luzmo-menu-section-header-bottom-edge-to-text,var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text)))}.luzmo-Menu-item--collapsible .angle{grid-area:angleAreaCollapsible}:host([has-submenu]) .angle{fill:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-drillin-icon-color-default,var(--menu-drillin-icon-color-default)));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-drillin-icon-color-default,var(--menu-drillin-icon-color-default)));grid-area:angleAreaDrillIn;margin-inline-start:var(--luzmo-menu-item-label-to-value-area-min-spacing,var(--menu-item-label-to-value-area-min-spacing));margin-inline-end:0}:host([has-submenu]) .is-open{--menu-item-background-color-default:var(--highcontrast-menu-item-selected-background-color,var(--luzmo-menu-item-background-color-hover,var(--menu-item-background-color-hover)))}:host([has-submenu]) .is-open .icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)))}:host([has-submenu]) .is-open .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)))}:host([has-submenu]) .is-open .checkmark{fill:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)));color:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)))}@media (hover:hover){:host(:hover){background-color:var(--highcontrast-menu-item-background-color-focus,var(--luzmo-menu-item-background-color-hover,var(--menu-item-background-color-hover)))}:host(:hover)>#label,:host(:hover)>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-content-color-hover,var(--menu-item-label-content-color-hover)))}:host([selected]:hover)>#label,:host([selected]:hover)>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-highlight-label-content-color,var(--menu-item-highlight-label-content-color)))}:host(:hover)>[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-description-color-hover,var(--menu-item-description-color-hover)))}:host(:hover)>::slotted([slot=value]){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-value-color-hover,var(--menu-item-value-color-hover)))}:host(:hover)>.icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)))}:host(:hover)>.angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)))}:host(:hover)>.checkmark{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)))}:host([disabled]:hover),:host([aria-disabled=true]:hover){cursor:default;background-color:initial}:host([disabled]:hover) #label,:host([disabled]:hover) .menu-item-tooltip-icon,:host([disabled]:hover) ::slotted([slot=value]),:host([aria-disabled=true]:hover) #label,:host([aria-disabled=true]:hover) ::slotted([slot=value]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-content-color-disabled,var(--menu-item-label-content-color-disabled)))}:host([disabled]:hover) [name=description]::slotted(*),:host([aria-disabled=true]:hover) [name=description]::slotted(*){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-description-color-disabled,var(--menu-item-description-color-disabled)))}:host([disabled]:hover) ::slotted([slot=icon]),:host([aria-disabled=true]:hover) ::slotted([slot=icon]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)));fill:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)))}.luzmo-Menu-item--collapsible.is-open:hover{background-color:var(--highcontrast-menu-item-background-color-default,var(--luzmo-menu-item-background-color-default,var(--menu-item-background-color-default)))}:host([has-submenu]:hover) .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)))}}:host([has-submenu][focused]) .angle,:host([has-submenu]:focus) .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-focus,var(--menu-drillin-icon-color-focus)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-focus,var(--menu-drillin-icon-color-focus)))}:host([has-submenu]:is(:active,[active])) .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-down,var(--menu-drillin-icon-color-down)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-down,var(--menu-drillin-icon-color-down)))}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}:host([focused]) .luzmo-Menu-backButton{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{text-align:initial;font-family:var(--luzmo-menu-item-font-family,var(--luzmo-font-family))}:host([hidden]){display:none}:host([disabled]){pointer-events:none}:host([disabled]) [name=value]::slotted(*),:host([has-submenu][disabled]) .angle{color:var(--luzmo-menu-item-label-icon-color-disabled,var(--luzmo-disabled-color))}#button{position:absolute;inset:0}.icon-container>svg{vertical-align:top}:host([dir=ltr]) [icon-only]::slotted(:last-of-type){margin-right:auto}:host([dir=rtl]) [icon-only]::slotted(:last-of-type){margin-left:auto}@media (forced-colors:active){:host{forced-color-adjust:none}}::slotted([slot=submenu]){width:max-content;max-width:100%}:host([no-wrap]) #label{display:block}.menu-item-tooltip-container{grid-area:actionsArea;justify-content:center;align-self:center;align-items:center;margin-inline-start:var(--luzmo-menu-item-label-to-value-area-min-spacing,var(--menu-item-label-to-value-area-min-spacing));display:flex}.menu-item-tooltip-container luzmo-tooltip{--tooltip-font-size:var(--luzmo-menu-item-tooltip-font-size,var(--tooltip-font-size))}.menu-item-tooltip-icon-trigger{cursor:default;justify-content:center;align-items:center;display:flex}.menu-item-tooltip-icon{width:.875rem;height:.875rem;font-size:.875rem}`,S=100,C=e=>u.html`
+  <span class="icon-container icon checkmark ${e.join(` `)}">
+    ${(0,f.luzmoIcon)(f.luzmoCheck)}
+  </span>
+`,w=e=>u.html`
+  <span class="icon-container icon angle ${e.join(` `)}">
+    ${(0,f.luzmoIcon)(f.luzmoAngleRight,{className:`indicator`})}
+  </span>
+`,T=e=>u.html`
+  <span class="icon-container icon info ${e.join(` `)}">
+    ${(0,f.luzmoIcon)(f.luzmoInfoCircleOutline)}
+  </span>
+`,E=class extends Event{get item(){return this._item}constructor(e){super(`luzmo-menu-item-added-or-updated`,{bubbles:!0,composed:!0}),this.menuCascade=new WeakMap,this.clear(e)}clear(e){this._item=e,this.currentAncestorWithSelects=void 0,e.menuData={cleanupSteps:[],focusRoot:void 0,selectionRoot:void 0,parentMenu:void 0},this.menuCascade=new WeakMap}},D=class extends r.t(i.t(o.t(n.t,`[slot="icon"]`))){static get styles(){return[(0,u.unsafeCSS)(x)]}get value(){return this._value||this.itemText}set value(e){e!==this._value&&(this._value=e||``,this._value?this.setAttribute(`value`,this._value):this.removeAttribute(`value`))}get itemText(){return this.itemChildren.content.reduce((e,t)=>e+(t.textContent||``).trim(),``)}renderTooltip(){return this.tooltip?(this.dependencyManager.add(`luzmo-tooltip`),this.dependencyManager.add(`luzmo-overlay`),Promise.resolve().then(()=>require(`./tooltip/index.cjs`)),Promise.resolve().then(()=>require(`./overlay/index.cjs`)),u.html`
+      <div class="menu-item-tooltip-container">
+        <!-- The visible icon that acts as trigger -->
+        <div
+          class="menu-item-tooltip-icon-trigger"
+          id="tooltip-trigger-${this.id}"
+        >
+          ${this.renderInfoIcon([`menu-item-tooltip-icon`])}
+        </div>
+
+        <!-- The overlay that shows the tooltip when hovering the icon -->
+        <luzmo-overlay
+          trigger="tooltip-trigger-${this.id}@hover"
+          placement=${this.tooltipPlacement}
+          type="hint"
+          ?disabled=${!this.dependencyManager.loaded}
+        >
+          <luzmo-tooltip> ${this.tooltip} </luzmo-tooltip>
+        </luzmo-overlay>
+      </div>
+    `):u.nothing}get focusElement(){return this}get hasIcon(){return this.slotContentIsPresent}get itemChildren(){if(!this.iconSlot||!this.contentSlot)return{icon:[],content:[]};if(this._itemChildren)return this._itemChildren;let e=this.iconSlot.assignedElements().map(e=>{let t=e.cloneNode(!0);return t.removeAttribute(`slot`),t.classList.toggle(`icon`),t}),t=this.contentSlot.assignedNodes().map(e=>e.cloneNode(!0));return this._itemChildren={icon:e,content:t},this._itemChildren}constructor(){super(),this.active=!1,this.dependencyManager=new c.t(this),this.focused=!1,this.selected=!1,this._value=``,this.hasSubmenu=!1,this.tooltipPlacement=`top`,this.noWrap=!1,this.renderAngleIcon=(e=[])=>w(e),this.renderCheckIcon=(e=[])=>C(e),this.renderInfoIcon=(e=[])=>T(e),this.open=!1,this.handleSlottableRequest=e=>{this.submenuElement?.dispatchEvent(new s.t(e.name,e.data))},this.proxyFocus=()=>{this.focus()},this.handleBeforetoggle=e=>{e.newState===`closed`&&(this.open=!0,this.overlayElement.manuallyKeepOpen(),this.overlayElement.removeEventListener(`beforetoggle`,this.handleBeforetoggle))},this.recentlyLeftChild=!1,this.willDispatchUpdate=!1,this.menuData={focusRoot:void 0,parentMenu:void 0,selectionRoot:void 0,cleanupSteps:[]},this.addEventListener(`click`,this.handleClickCapture,{capture:!0}),new p.MutationController(this,{config:{characterData:!0,childList:!0,subtree:!0},callback:e=>{e.every(e=>e.target.slot===`submenu`)||this.breakItemChildrenCache()}})}click(){this.disabled||this.shouldProxyClick()||super.click()}handleClickCapture(e){if(this.disabled)return e.preventDefault(),e.stopImmediatePropagation(),e.stopPropagation(),!1}shouldProxyClick(){let e=!1;return this.anchorElement&&(this.anchorElement.click(),e=!0),e}breakItemChildrenCache(){this._itemChildren=void 0,this.triggerUpdate()}renderSubmenu(){let e=u.html`
+      <slot
+        name="submenu"
+        @slotchange=${this.manageSubmenu}
+        @luzmo-menu-item-added-or-updated=${{handleEvent:e=>{e.clear(e.item)},capture:!0}}
+        @focusin=${e=>e.stopPropagation()}
+      ></slot>
+    `;return this.hasSubmenu?(this.dependencyManager.add(`luzmo-overlay`),this.dependencyManager.add(`luzmo-popover`),Promise.resolve().then(()=>require(`./overlay-DdrfkOry.cjs`)).then(e=>e.n),Promise.resolve().then(()=>require(`./popover-dgL04x6P.cjs`)).then(e=>e.n),u.html`
+      <luzmo-overlay
+        .triggerElement=${this}
+        ?disabled=${!this.hasSubmenu}
+        ?open=${this.hasSubmenu&&this.open&&this.dependencyManager.loaded}
+        .placement=${this.isLTR?`right-start`:`left-start`}
+        .offset=${[-10,-5]}
+        .type=${`auto`}
+        @close=${e=>e.stopPropagation()}
+        @slottable-request=${this.handleSlottableRequest}
+      >
+        <luzmo-popover
+          @change=${e=>{this.handleSubmenuChange(e),this.open=!1}}
+          @pointerenter=${this.handleSubmenuPointerenter}
+          @pointerleave=${this.handleSubmenuPointerleave}
+          @luzmo-menu-item-added-or-updated=${e=>e.stopPropagation()}
+        >
+          ${e}
+        </luzmo-popover>
+      </luzmo-overlay>
+      ${this.renderAngleIcon()}
+    `):e}render(){return u.html`
+      ${this.selected?u.html`
+            ${this.renderCheckIcon(this.hasIcon?[`checkmark--withAdjacentIcon`]:[])}
+          `:u.nothing}
+      <slot name="icon"></slot>
+      <div id="label">
+        <slot id="slot"></slot>
+      </div>
+      <slot name="description"></slot>
+      <slot name="value"></slot>
+      ${this.renderTooltip()}
+      ${this.href&&this.href.length>0?super.renderAnchor({id:`button`,ariaHidden:!0,className:`button anchor hidden`}):u.nothing}
+      ${this.renderSubmenu()}
+    `}manageSubmenu(e){this.submenuElement=e.target.assignedElements({flatten:!0})[0],this.hasSubmenu=!!this.submenuElement,this.hasSubmenu&&this.setAttribute(`aria-haspopup`,`true`)}handlePointerdown(e){e.target===this&&this.hasSubmenu&&this.open&&(this.addEventListener(`focus`,this.handleSubmenuFocus,{once:!0}),this.overlayElement.addEventListener(`beforetoggle`,this.handleBeforetoggle))}firstUpdated(e){super.firstUpdated(e),this.setAttribute(`tabindex`,`-1`),this.addEventListener(`pointerdown`,this.handlePointerdown),this.addEventListener(`pointerenter`,this.closeOverlaysForRoot),this.hasAttribute(`id`)||(this.id=`luzmo-menu-item-${a.t()}`)}closeOverlaysForRoot(){this.open||this.menuData.parentMenu?.closeDescendentOverlays()}handleSubmenuClick(e){e.composedPath().includes(this.overlayElement)||this.openOverlay()}handleSubmenuFocus(){requestAnimationFrame(()=>{this.overlayElement.open=this.open})}handlePointerenter(){if(this.leaveTimeout){clearTimeout(this.leaveTimeout),delete this.leaveTimeout;return}this.openOverlay()}handlePointerleave(){this.open&&!this.recentlyLeftChild&&(this.leaveTimeout=setTimeout(()=>{delete this.leaveTimeout,this.open=!1},S))}handleSubmenuChange(e){e.stopPropagation(),this.menuData.selectionRoot?.selectOrToggleItem(this)}handleSubmenuPointerenter(){this.recentlyLeftChild=!0}handleSubmenuPointerleave(){requestAnimationFrame(()=>{this.recentlyLeftChild=!1})}handleSubmenuOpen(e){this.focused=!1;let t=e.composedPath().find(e=>e!==this.overlayElement&&e.localName===`luzmo-overlay`);this.overlayElement.parentOverlayToForceClose=t}cleanup(){this.open=!1,this.active=!1}openOverlay(){!this.hasSubmenu||this.open||this.disabled||(this.open=!0,this.active=!0,this.setAttribute(`aria-expanded`,`true`),this.addEventListener(`luzmo-closed`,this.cleanup,{once:!0}))}updateAriaSelected(){let e=this.getAttribute(`role`);e===`option`?this.setAttribute(`aria-selected`,this.selected?`true`:`false`):(e===`menuitemcheckbox`||e===`menuitemradio`)&&this.setAttribute(`aria-checked`,this.selected?`true`:`false`)}setRole(e){this.setAttribute(`role`,e),this.updateAriaSelected()}updated(e){if(super.updated(e),e.has(`label`)&&(this.label||e.get(`label`)!==void 0)&&this.setAttribute(`aria-label`,this.label||``),e.has(`active`)&&(this.active||e.get(`active`)!==void 0)&&this.active&&this.menuData.selectionRoot?.closeDescendentOverlays(),this.anchorElement&&(this.anchorElement.addEventListener(`focus`,this.proxyFocus),this.anchorElement.tabIndex=-1),e.has(`selected`)&&this.updateAriaSelected(),e.has(`hasSubmenu`)&&(this.hasSubmenu||e.get(`hasSubmenu`)!==void 0))if(this.hasSubmenu){this.abortControllerSubmenu=new AbortController;let e={signal:this.abortControllerSubmenu.signal};this.addEventListener(`click`,this.handleSubmenuClick,e),this.addEventListener(`pointerenter`,this.handlePointerenter,e),this.addEventListener(`pointerleave`,this.handlePointerleave,e),this.addEventListener(`luzmo-opened`,this.handleSubmenuOpen,e)}else this.abortControllerSubmenu?.abort()}connectedCallback(){super.connectedCallback(),this.triggerUpdate()}disconnectedCallback(){this.menuData.cleanupSteps.forEach(e=>e(this)),this.menuData={focusRoot:void 0,parentMenu:void 0,selectionRoot:void 0,cleanupSteps:[]},super.disconnectedCallback()}async triggerUpdate(){this.willDispatchUpdate||(this.willDispatchUpdate=!0,await new Promise(e=>requestAnimationFrame(e)),this.dispatchUpdate())}dispatchUpdate(){this.isConnected&&(this.dispatchEvent(new E(this)),this.willDispatchUpdate=!1)}};e.t([(0,d.property)({type:Boolean,reflect:!0})],D.prototype,`active`,void 0),e.t([(0,d.property)({type:Boolean,reflect:!0})],D.prototype,`focused`,void 0),e.t([(0,d.property)({type:Boolean,reflect:!0})],D.prototype,`selected`,void 0),e.t([(0,d.property)({type:String})],D.prototype,`value`,null),e.t([(0,d.property)({type:Boolean,reflect:!0,attribute:`has-submenu`})],D.prototype,`hasSubmenu`,void 0),e.t([(0,d.property)({type:String})],D.prototype,`tooltip`,void 0),e.t([(0,d.property)({type:String,attribute:`tooltip-placement`})],D.prototype,`tooltipPlacement`,void 0),e.t([(0,d.query)(`slot:not([name])`)],D.prototype,`contentSlot`,void 0),e.t([(0,d.query)(`slot[name="icon"]`)],D.prototype,`iconSlot`,void 0),e.t([(0,d.property)({type:Boolean,reflect:!0,attribute:`no-wrap`,hasChanged(){return!1}})],D.prototype,`noWrap`,void 0),e.t([(0,d.query)(`.anchor`)],D.prototype,`anchorElement`,void 0),e.t([(0,d.query)(`luzmo-overlay`)],D.prototype,`overlayElement`,void 0),e.t([(0,d.property)({type:Boolean,reflect:!0})],D.prototype,`open`,void 0),customElements.get(`luzmo-menu`)||customElements.define(`luzmo-menu`,g),customElements.get(`luzmo-menu-divider`)||customElements.define(`luzmo-menu-divider`,v),customElements.get(`luzmo-menu-group`)||customElements.define(`luzmo-menu-group`,b),customElements.get(`luzmo-menu-item`)||customElements.define(`luzmo-menu-item`,D),Object.defineProperty(exports,`a`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return E}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return b}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return D}});

package/components/multi-language-field/index.cjs

@@ -15,25 +15,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../base-CBCg3yyw.cjs"),u=require("../sized-mixin-CPxE5C96.cjs");require("../text-field/index.cjs");const p=require("../manage-help-text-DhgARkZX.cjs"),h=":host{display:inline-block}:host luzmo-text-field{width:100%}";var d=Object.defineProperty,l=(n,i,r,g)=>{for(var a=void 0,o=n.length-1,s;o>=0;o--)(s=n[o])&&(a=s(i,r,a)||a);return a&&d(i,r,a),a};class t extends p.ManageHelpText(u.SizedMixin(e.LuzmoElement,{noDefaultSize:!0})){constructor(){super(...arguments),this.allowedKeys="",this.i18nPlaceholder={},this.type="text",this.grows=!1,this.maxlength=-1,this.minlength=-1,this.multiline=!1,this.rows=-1,this.quiet=!1,this.disabled=!1,this.required=!1,this.readonly=!1,this.language="en",this.defaultLanguage="en",this.value={}}static get styles(){return[e.r(h)]}get _localizedValue(){const i={...this.value};return i[this.language]??i[this.defaultLanguage]??Object.values(i)[0]??""}get _localizedPlaceholder(){const i={...this.i18nPlaceholder};return i[this.language]??i[this.defaultLanguage]??Object.values(i)[0]??""}handleChange(i){i.stopPropagation(),i.preventDefault();const r=i.target;this.value[this.language]!==r.value&&(this.value={...this.value,[this.language]:r.value},this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:this.value}})))}render(){return e.x`
-      <luzmo-text-field
-        .value=${this._localizedValue}
-        .size=${this.size}
-        .placeholder=${this._localizedPlaceholder}
-        .name=${this.name}
-        .allowedKeys=${this.allowedKeys}
-        .type=${this.type}
-        .pattern=${this.pattern}
-        .maxlength=${this.maxlength}
-        .minlength=${this.minlength}
-        ?multiline=${this.multiline}
-        ?grows=${this.grows}
-        .rows=${this.rows}
-        ?quiet=${this.quiet}
-        ?disabled=${this.disabled}
-        ?readonly=${this.readonly}
-        ?required=${this.required}
-        @input=${this.handleChange}
-        @change=${this.handleChange}
-      ></luzmo-text-field>
-    `}}l([e.n({attribute:"allowed-keys"})],t.prototype,"allowedKeys");l([e.n({type:String,reflect:!0})],t.prototype,"name");l([e.n({type:Object,attribute:"i18n-placeholder"})],t.prototype,"i18nPlaceholder");l([e.n({attribute:"type",reflect:!0})],t.prototype,"type");l([e.n()],t.prototype,"pattern");l([e.n({type:Boolean,reflect:!0})],t.prototype,"grows");l([e.n({type:Number})],t.prototype,"maxlength");l([e.n({type:Number})],t.prototype,"minlength");l([e.n({type:Boolean,reflect:!0})],t.prototype,"multiline");l([e.n({type:Number})],t.prototype,"rows");l([e.n({type:Boolean,reflect:!0})],t.prototype,"quiet");l([e.n({type:Boolean,reflect:!0})],t.prototype,"disabled");l([e.n({type:Boolean,reflect:!0})],t.prototype,"required");l([e.n({type:Boolean,reflect:!0})],t.prototype,"readonly");l([e.n({type:String,reflect:!0})],t.prototype,"autocomplete");l([e.n({type:String,reflect:!0})],t.prototype,"language");l([e.n({type:String,reflect:!0})],t.prototype,"defaultLanguage");l([e.n({type:Object,reflect:!0})],t.prototype,"value");customElements.get("luzmo-multi-language-field")||customElements.define("luzmo-multi-language-field",t);exports.LuzmoMultiLangField=t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../multi-language-field-DmoMyCBH.cjs`);exports.LuzmoMultiLangField=e.t;

package/components/multi-language-field/index.js

@@ -15,134 +15,11 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { a as m, r as c, x as d, n as e } from "../base-WsynuqaS.js";
-import { S as p } from "../sized-mixin-D4ACoVUr.js";
-import "../text-field/index.js";
-import { M as z } from "../manage-help-text-syYnjKGL.js";
-const s = () => {
-  if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
-    const r = document.createElement("style");
-    r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-informative-color: #1a77e9;--luzmo-informative-color-rgb: 26, 119, 233;--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
-  }
-};
-s();
-const g = ":host{display:inline-block}:host luzmo-text-field{width:100%}";
-var h = Object.defineProperty, l = (r, t, i, f) => {
-  for (var u = void 0, a = r.length - 1, n; a >= 0; a--)
-    (n = r[a]) && (u = n(t, i, u) || u);
-  return u && h(t, i, u), u;
-};
-class o extends z(
-  p(m, {
-    noDefaultSize: !0
-  })
-) {
-  constructor() {
-    super(...arguments), this.allowedKeys = "", this.i18nPlaceholder = {}, this.type = "text", this.grows = !1, this.maxlength = -1, this.minlength = -1, this.multiline = !1, this.rows = -1, this.quiet = !1, this.disabled = !1, this.required = !1, this.readonly = !1, this.language = "en", this.defaultLanguage = "en", this.value = {};
-  }
-  static get styles() {
-    return [c(g)];
-  }
-  get _localizedValue() {
-    const t = { ...this.value };
-    return t[this.language] ?? t[this.defaultLanguage] ?? Object.values(t)[0] ?? "";
-  }
-  get _localizedPlaceholder() {
-    const t = { ...this.i18nPlaceholder };
-    return t[this.language] ?? t[this.defaultLanguage] ?? Object.values(t)[0] ?? "";
-  }
-  handleChange(t) {
-    t.stopPropagation(), t.preventDefault();
-    const i = t.target;
-    this.value[this.language] !== i.value && (this.value = { ...this.value, [this.language]: i.value }, this.dispatchEvent(
-      new CustomEvent("change", {
-        bubbles: !0,
-        composed: !0,
-        cancelable: !0,
-        detail: { value: this.value }
-      })
-    ));
-  }
-  render() {
-    return d`
-      <luzmo-text-field
-        .value=${this._localizedValue}
-        .size=${this.size}
-        .placeholder=${this._localizedPlaceholder}
-        .name=${this.name}
-        .allowedKeys=${this.allowedKeys}
-        .type=${this.type}
-        .pattern=${this.pattern}
-        .maxlength=${this.maxlength}
-        .minlength=${this.minlength}
-        ?multiline=${this.multiline}
-        ?grows=${this.grows}
-        .rows=${this.rows}
-        ?quiet=${this.quiet}
-        ?disabled=${this.disabled}
-        ?readonly=${this.readonly}
-        ?required=${this.required}
-        @input=${this.handleChange}
-        @change=${this.handleChange}
-      ></luzmo-text-field>
-    `;
-  }
-}
-l([
-  e({ attribute: "allowed-keys" })
-], o.prototype, "allowedKeys");
-l([
-  e({ type: String, reflect: !0 })
-], o.prototype, "name");
-l([
-  e({ type: Object, attribute: "i18n-placeholder" })
-], o.prototype, "i18nPlaceholder");
-l([
-  e({ attribute: "type", reflect: !0 })
-], o.prototype, "type");
-l([
-  e()
-], o.prototype, "pattern");
-l([
-  e({ type: Boolean, reflect: !0 })
-], o.prototype, "grows");
-l([
-  e({ type: Number })
-], o.prototype, "maxlength");
-l([
-  e({ type: Number })
-], o.prototype, "minlength");
-l([
-  e({ type: Boolean, reflect: !0 })
-], o.prototype, "multiline");
-l([
-  e({ type: Number })
-], o.prototype, "rows");
-l([
-  e({ type: Boolean, reflect: !0 })
-], o.prototype, "quiet");
-l([
-  e({ type: Boolean, reflect: !0 })
-], o.prototype, "disabled");
-l([
-  e({ type: Boolean, reflect: !0 })
-], o.prototype, "required");
-l([
-  e({ type: Boolean, reflect: !0 })
-], o.prototype, "readonly");
-l([
-  e({ type: String, reflect: !0 })
-], o.prototype, "autocomplete");
-l([
-  e({ type: String, reflect: !0 })
-], o.prototype, "language");
-l([
-  e({ type: String, reflect: !0 })
-], o.prototype, "defaultLanguage");
-l([
-  e({ type: Object, reflect: !0 })
-], o.prototype, "value");
-customElements.get("luzmo-multi-language-field") || customElements.define("luzmo-multi-language-field", o);
-export {
-  o as LuzmoMultiLangField
-};
+(() => {
+	if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
+		let e = document.createElement("style");
+		e.setAttribute("data-luzmo-vars", ""), e.textContent = "html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: color-mix(in oklch, var(--luzmo-border-color-full), black 25%);--luzmo-border-color-full-down: color-mix(in oklch, var(--luzmo-border-color-full), black 45%);--luzmo-border-color-full-focus: color-mix(in oklch, var(--luzmo-border-color-full), black 25%);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: color-mix(in oklch, var(--luzmo-font-color), black 8%);--luzmo-font-color-down: color-mix(in oklch, var(--luzmo-font-color), black 20%);--luzmo-font-color-focus: color-mix(in oklch, var(--luzmo-font-color), black 8%);--luzmo-primary: #4434ff;--luzmo-primary-hover: color-mix(in oklch, var(--luzmo-primary), black 8%);--luzmo-primary-down: color-mix(in oklch, var(--luzmo-primary), black 20%);--luzmo-primary-focus: color-mix(in oklch, var(--luzmo-primary), black 8%);--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 5%), black 1.5%);--luzmo-background-color-down: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 7%), black 1%);--luzmo-background-color-focus: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 5%), black 1.5%);--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: color-mix(in oklch, var(--luzmo-background-color-highlight), black 25%);--luzmo-background-color-highlight-down: color-mix(in oklch, var(--luzmo-background-color-highlight), black 45%);--luzmo-background-color-highlight-focus: color-mix(in oklch, var(--luzmo-background-color-highlight), black 25%);--luzmo-secondary: #d000d0;--luzmo-secondary-hover: color-mix(in oklch, var(--luzmo-secondary), black 8%);--luzmo-secondary-down: color-mix(in oklch, var(--luzmo-secondary), black 20%);--luzmo-secondary-focus: color-mix(in oklch, var(--luzmo-secondary), black 8%);--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 208, 0, 208;--luzmo-scrollbar-size: 6px;--luzmo-scrollbar-thumb-background: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-scrollbar-thumb-border-radius: var(--luzmo-border-radius-s);--luzmo-scrollbar-thumb-hover-background: rgba( var(--luzmo-border-color-rgb), 0.4 );--luzmo-scrollbar-track-background: transparent;--luzmo-scrollbar-track-border-radius: var(--luzmo-border-radius-s);--luzmo-scrollbar-width: thin;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: color-mix(in oklch, var(--luzmo-negative-color), black 8%);--luzmo-negative-color-down: color-mix(in oklch, var(--luzmo-negative-color), black 20%);--luzmo-negative-color-focus: color-mix(in oklch, var(--luzmo-negative-color), black 8%);--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-negative-inverse-color: #ffffff;--luzmo-positive-color: rgb(18, 133, 90);--luzmo-positive-color-hover: color-mix(in oklch, var(--luzmo-positive-color), black 8%);--luzmo-positive-color-down: color-mix(in oklch, var(--luzmo-positive-color), black 20%);--luzmo-positive-color-focus: color-mix(in oklch, var(--luzmo-positive-color), black 8%);--luzmo-positive-color-rgb: 18, 133, 90;--luzmo-positive-inverse-color: #ffffff;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: color-mix(in oklch, var(--luzmo-selected-color), black 25%);--luzmo-selected-color-down: color-mix(in oklch, var(--luzmo-selected-color), black 45%);--luzmo-selected-color-focus: color-mix(in oklch, var(--luzmo-selected-color), black 25%);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: color-mix(in oklch, var(--luzmo-selected-color-hard), black 25%);--luzmo-selected-color-hard-down: color-mix(in oklch, var(--luzmo-selected-color-hard), black 45%);--luzmo-selected-color-hard-focus: color-mix(in oklch, var(--luzmo-selected-color-hard), black 25%);--luzmo-informative-color: #1670dd;--luzmo-informative-color-rgb: 22, 112, 221;--luzmo-notice-color: rgb(229, 127, 0);--luzmo-seafoam-color: rgb(0, 140, 140);--luzmo-indigo-color: rgb(68, 52, 255);--luzmo-purple-color: rgb(112, 48, 210);--luzmo-fuchsia-color: rgb(205, 30, 170);--luzmo-magenta-color: rgb(203, 36, 98);--luzmo-yellow-color: rgb(228, 208, 0);--luzmo-gray-color: rgb(110, 110, 110);--luzmo-red-color: rgb(202, 34, 28);--luzmo-orange-color: rgb(218, 123, 17);--luzmo-chartreuse-color: rgb(85, 135, 0);--luzmo-celery-color: rgb(48, 134, 22);--luzmo-green-color: rgb(18, 133, 90);--luzmo-cyan-color: rgb(0, 134, 180);--luzmo-blue-color: rgb(22, 112, 221);--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 10px;--luzmo-icon-size-xs: 12px;--luzmo-icon-size-s: 14px;--luzmo-icon-size-m: 16px;--luzmo-icon-size-l: 18px;--luzmo-icon-size-xl: 20px;--luzmo-icon-size-xxl: 32px}", document.head.appendChild(e);
+	}
+})();
+import { t as e } from "../multi-language-field-BzY75rOY.js";
+export { e as LuzmoMultiLangField };

package/components/multi-language-field/multi-language-field.d.ts

@@ -15,6 +15,7 @@ declare const LuzmoMultiLangField_base: typeof LuzmoElement & {
  */
 export declare class LuzmoMultiLangField extends LuzmoMultiLangField_base {
     static get styles(): CSSResultArray;
+    label: string;
     allowedKeys: string;
     name: string | undefined;
     i18nPlaceholder: Record<string, string>;

package/components/multi-language-field-BzY75rOY.js

@@ -0,0 +1,122 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 Luzmo
+ * All rights reserved.
+ * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
+ * This license allows users with a current active Luzmo account to use Lucero.
+ * This license terminates automatically if a user no longer has an active Luzmo account.
+ * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ * */
+import { n as e, t } from "./decorate-aGxJUVxg.js";
+import { n } from "./sized-mixin-DaBoZkVS.js";
+import { t as r } from "./manage-help-text-CF0xBh0F.js";
+import "./text-field-BoGAvXvh.js";
+import { html as i, unsafeCSS as a } from "lit";
+import { property as o } from "lit/decorators.js";
+//#region src/components/multi-language-field/multi-language-field.module.scss?inline
+var s = ":host{display:inline-block}:host luzmo-text-field{width:100%}", c = class extends r(n(e, { noDefaultSize: !0 })) {
+	constructor(...e) {
+		super(...e), this.label = "", this.allowedKeys = "", this.i18nPlaceholder = {}, this.type = "text", this.grows = !1, this.maxlength = -1, this.minlength = -1, this.multiline = !1, this.rows = -1, this.quiet = !1, this.disabled = !1, this.required = !1, this.readonly = !1, this.language = "en", this.defaultLanguage = "en", this.value = {};
+	}
+	static get styles() {
+		return [a(s)];
+	}
+	get _localizedValue() {
+		let e = { ...this.value };
+		return e[this.language] ?? e[this.defaultLanguage] ?? Object.values(e)[0] ?? "";
+	}
+	get _localizedPlaceholder() {
+		let e = { ...this.i18nPlaceholder };
+		return e[this.language] ?? e[this.defaultLanguage] ?? Object.values(e)[0] ?? "";
+	}
+	handleChange(e) {
+		e.stopPropagation(), e.preventDefault();
+		let t = e.target;
+		this.value[this.language] !== t.value && (this.value = {
+			...this.value,
+			[this.language]: t.value
+		}, this.dispatchEvent(new CustomEvent("change", {
+			bubbles: !0,
+			composed: !0,
+			cancelable: !0,
+			detail: { value: this.value }
+		})));
+	}
+	render() {
+		return i`
+      <luzmo-text-field
+        .label=${this.label}
+        .value=${this._localizedValue}
+        .size=${this.size}
+        .placeholder=${this._localizedPlaceholder}
+        .name=${this.name}
+        .allowedKeys=${this.allowedKeys}
+        .type=${this.type}
+        .pattern=${this.pattern}
+        .maxlength=${this.maxlength}
+        .minlength=${this.minlength}
+        ?multiline=${this.multiline}
+        ?grows=${this.grows}
+        .rows=${this.rows}
+        ?quiet=${this.quiet}
+        ?disabled=${this.disabled}
+        ?readonly=${this.readonly}
+        ?required=${this.required}
+        @input=${this.handleChange}
+        @change=${this.handleChange}
+      ></luzmo-text-field>
+    `;
+	}
+};
+//#endregion
+//#region src/components/multi-language-field/index.ts
+t([o({ type: String })], c.prototype, "label", void 0), t([o({ attribute: "allowed-keys" })], c.prototype, "allowedKeys", void 0), t([o({
+	type: String,
+	reflect: !0
+})], c.prototype, "name", void 0), t([o({
+	type: Object,
+	attribute: "i18n-placeholder"
+})], c.prototype, "i18nPlaceholder", void 0), t([o({
+	attribute: "type",
+	reflect: !0
+})], c.prototype, "type", void 0), t([o()], c.prototype, "pattern", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], c.prototype, "grows", void 0), t([o({ type: Number })], c.prototype, "maxlength", void 0), t([o({ type: Number })], c.prototype, "minlength", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], c.prototype, "multiline", void 0), t([o({ type: Number })], c.prototype, "rows", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], c.prototype, "quiet", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], c.prototype, "disabled", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], c.prototype, "required", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], c.prototype, "readonly", void 0), t([o({
+	type: String,
+	reflect: !0
+})], c.prototype, "autocomplete", void 0), t([o({
+	type: String,
+	reflect: !0
+})], c.prototype, "language", void 0), t([o({
+	type: String,
+	reflect: !0
+})], c.prototype, "defaultLanguage", void 0), t([o({
+	type: Object,
+	reflect: !0
+})], c.prototype, "value", void 0), customElements.get("luzmo-multi-language-field") || customElements.define("luzmo-multi-language-field", c);
+//#endregion
+export { c as t };

package/components/multi-language-field-DmoMyCBH.cjs

@@ -0,0 +1,40 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 Luzmo
+ * All rights reserved.
+ * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
+ * This license allows users with a current active Luzmo account to use Lucero.
+ * This license terminates automatically if a user no longer has an active Luzmo account.
+ * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ * */
+require(`./chunk-D-qHiVGv.cjs`);const e=require(`./decorate-B2wePfNm.cjs`),t=require(`./sized-mixin-StFA4y0J.cjs`),n=require(`./manage-help-text-D9VbYRf_.cjs`);require(`./text-field-A4Obzs4l.cjs`);let r=require(`lit`),i=require(`lit/decorators.js`);var a=`:host{display:inline-block}:host luzmo-text-field{width:100%}`,o=class extends n.t(t.n(e.n,{noDefaultSize:!0})){constructor(...e){super(...e),this.label=``,this.allowedKeys=``,this.i18nPlaceholder={},this.type=`text`,this.grows=!1,this.maxlength=-1,this.minlength=-1,this.multiline=!1,this.rows=-1,this.quiet=!1,this.disabled=!1,this.required=!1,this.readonly=!1,this.language=`en`,this.defaultLanguage=`en`,this.value={}}static get styles(){return[(0,r.unsafeCSS)(a)]}get _localizedValue(){let e={...this.value};return e[this.language]??e[this.defaultLanguage]??Object.values(e)[0]??``}get _localizedPlaceholder(){let e={...this.i18nPlaceholder};return e[this.language]??e[this.defaultLanguage]??Object.values(e)[0]??``}handleChange(e){e.stopPropagation(),e.preventDefault();let t=e.target;this.value[this.language]!==t.value&&(this.value={...this.value,[this.language]:t.value},this.dispatchEvent(new CustomEvent(`change`,{bubbles:!0,composed:!0,cancelable:!0,detail:{value:this.value}})))}render(){return r.html`
+      <luzmo-text-field
+        .label=${this.label}
+        .value=${this._localizedValue}
+        .size=${this.size}
+        .placeholder=${this._localizedPlaceholder}
+        .name=${this.name}
+        .allowedKeys=${this.allowedKeys}
+        .type=${this.type}
+        .pattern=${this.pattern}
+        .maxlength=${this.maxlength}
+        .minlength=${this.minlength}
+        ?multiline=${this.multiline}
+        ?grows=${this.grows}
+        .rows=${this.rows}
+        ?quiet=${this.quiet}
+        ?disabled=${this.disabled}
+        ?readonly=${this.readonly}
+        ?required=${this.required}
+        @input=${this.handleChange}
+        @change=${this.handleChange}
+      ></luzmo-text-field>
+    `}};e.t([(0,i.property)({type:String})],o.prototype,`label`,void 0),e.t([(0,i.property)({attribute:`allowed-keys`})],o.prototype,`allowedKeys`,void 0),e.t([(0,i.property)({type:String,reflect:!0})],o.prototype,`name`,void 0),e.t([(0,i.property)({type:Object,attribute:`i18n-placeholder`})],o.prototype,`i18nPlaceholder`,void 0),e.t([(0,i.property)({attribute:`type`,reflect:!0})],o.prototype,`type`,void 0),e.t([(0,i.property)()],o.prototype,`pattern`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0})],o.prototype,`grows`,void 0),e.t([(0,i.property)({type:Number})],o.prototype,`maxlength`,void 0),e.t([(0,i.property)({type:Number})],o.prototype,`minlength`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0})],o.prototype,`multiline`,void 0),e.t([(0,i.property)({type:Number})],o.prototype,`rows`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0})],o.prototype,`quiet`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0})],o.prototype,`disabled`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0})],o.prototype,`required`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0})],o.prototype,`readonly`,void 0),e.t([(0,i.property)({type:String,reflect:!0})],o.prototype,`autocomplete`,void 0),e.t([(0,i.property)({type:String,reflect:!0})],o.prototype,`language`,void 0),e.t([(0,i.property)({type:String,reflect:!0})],o.prototype,`defaultLanguage`,void 0),e.t([(0,i.property)({type:Object,reflect:!0})],o.prototype,`value`,void 0),customElements.get(`luzmo-multi-language-field`)||customElements.define(`luzmo-multi-language-field`,o),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return o}});