@moni-labs/moni-ui 0.4.13 → 0.4.16

package/dist/cdn/components/moni-select.js

@@ -1,336 +1,340 @@
-import{a as e,c as t,d as n,i as r,m as i,n as a,o,r as s,s as c,t as l}from"../chunks/decorate-DxJYS4gw.js";import{t as u}from"../chunks/query-SWT-tzvq.js";import{t as d}from"../chunks/event-emitter-CGhsijUg.js";import"./moni-icon.js";import{t as f}from"../chunks/if-defined-DdzvcoI7.js";import"./moni-progress.js";import{t as p}from"../chunks/class-map-DsL1Jr2T.js";import"./moni-select-option.js";var m=class extends r{static{this.formAssociated=!0}constructor(){super(),this.name=``,this.label=``,this.variant=`filled`,this.size=`medium`,this.shape=`no-round`,this.disabled=!1,this.required=!1,this.loading=!1,this.helper=``,this.errorText=``,this.error=!1,this.value=``,this.icon=``,this.trailingIcon=`arrow_drop_down`,this.searchable=!1,this.clearable=!1,this.sheet=!1,this.placeholder=``,this.positioning=`absolute`,this.placement=`auto`,this.dropdownWidth=`trigger`,this.dropdownMaxHeight=``,this._open=!1,this._searchQuery=``,this._actualPlacement=`bottom`,this._parsedOptions=[],this._activeIndex=-1,this._menuStyle=``,this._menuMaxHeight=`75vh`,this._useInlineCategories=!1,this._drilldownPath=[],this._handleOutsideClick=e=>{this._open&&!e.composedPath().includes(this)&&this._closeDropdown()},this._handlePeerOpen=e=>{let t=e.detail?.item;t&&t!==this&&this._open&&this._closeDropdown()},this._handleScroll=()=>{this._open&&(this._determineActualPlacement(),this._updateMenuPosition())},this._handleResize=()=>{this._open&&(this._determineActualPlacement(),this._updateMenuPosition())},this._internals=this.attachInternals()}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}_syncValidity(){if(this._internals?.setValidity){if(this.required&&!this.value){this._internals.setValidity({valueMissing:!0},`Selecciona una opción.`,this._input??void 0);return}this._internals.setValidity({})}}static{this.styles=[s,a,i`
-			:host {
-				position: relative;
-				display: block;
-			}
-
-			.field {
-				cursor: pointer;
-			}
-
-			input[type='text'] {
-				cursor: pointer;
-				width: 100%;
-			}
-
-			input[type='text'][readonly] {
-				caret-color: transparent;
-				user-select: none;
-			}
-
-			/* Dropdown menu overlay */
-			.dropdown-menu {
-				position: absolute;
-				top: 100%;
-				left: 0;
-				right: 0;
-				z-index: 100;
-				background-color: var(--surface-container);
-				box-shadow: var(--elevate3);
-				border-radius: 0.5rem;
-				margin-top: 4px;
-				padding: 4px 0;
-				list-style: none;
-				opacity: 0;
-				visibility: hidden;
-				transform: scale(0.95) translateY(-8px);
-				transform-origin: top;
-				transition: 
-					opacity var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1), 
-					transform var(--speed3) cubic-bezier(0.34, 1.56, 0.64, 1), 
-					visibility var(--speed3);
-			}
-
-			.dropdown-menu.open {
-				opacity: 1;
-				visibility: visible;
-				transform: scale(1) translateY(0);
-			}
-
-			/* positioning="body" promotes the menu to the browser's top layer.
+import{a as e,c as t,d as n,i as r,m as i,n as a,o,r as s,s as c,t as l}from"../chunks/decorate-B7wZvwrn.js";import{t as u}from"../chunks/query-SWT-tzvq.js";import{t as d}from"../chunks/event-emitter-CGhsijUg.js";import"./moni-icon.js";import{t as f}from"../chunks/if-defined-5hr_ccFw.js";import"./moni-progress.js";import{t as p}from"../chunks/class-map-QyT9W7rZ.js";import"./moni-select-option.js";var m=class extends r{static{this.formAssociated=!0}constructor(){super(),this.name=``,this.label=``,this.variant=`filled`,this.size=`medium`,this.shape=`no-round`,this.disabled=!1,this.required=!1,this.loading=!1,this.helper=``,this.errorText=``,this.error=!1,this.value=``,this.icon=``,this.trailingIcon=`arrow_drop_down`,this.searchable=!1,this.clearable=!1,this.sheet=!1,this.placeholder=``,this.positioning=`absolute`,this.placement=`auto`,this.dropdownWidth=`trigger`,this.dropdownMaxHeight=``,this._open=!1,this._searchQuery=``,this._actualPlacement=`bottom`,this._parsedOptions=[],this._activeIndex=-1,this._menuStyle=``,this._menuMaxHeight=`75vh`,this._useInlineCategories=!1,this._drilldownPath=[],this._handleOutsideClick=e=>{this._open&&!e.composedPath().includes(this)&&this._closeDropdown()},this._handlePeerOpen=e=>{let t=e.detail?.item;t&&t!==this&&this._open&&this._closeDropdown()},this._handleScroll=()=>{this._open&&(this._determineActualPlacement(),this._updateMenuPosition())},this._handleResize=()=>{this._open&&(this._determineActualPlacement(),this._updateMenuPosition())},this._internals=this.attachInternals()}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}_syncValidity(){if(this._internals?.setValidity){if(this.required&&!this.value){this._internals.setValidity({valueMissing:!0},`Selecciona una opción.`,this._input??void 0);return}this._internals.setValidity({})}}static{this.styles=[s,a,i`
+      :host {
+        position: relative;
+        display: block;
+      }
+
+      .field {
+        cursor: pointer;
+      }
+
+      input[type="text"] {
+        cursor: pointer;
+        width: 100%;
+      }
+
+      input[type="text"][readonly] {
+        caret-color: transparent;
+        user-select: none;
+      }
+
+      /* Dropdown menu overlay */
+      .dropdown-menu {
+        position: absolute;
+        top: 100%;
+        left: 0;
+        right: 0;
+        z-index: 100;
+        background-color: var(--surface-container);
+        box-shadow: var(--elevate3);
+        border-radius: 0.5rem;
+        margin-top: 4px;
+        padding: 4px 0;
+        list-style: none;
+        opacity: 0;
+        visibility: hidden;
+        transform: scale(0.95) translateY(-8px);
+        transform-origin: top;
+        transition:
+          opacity var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1),
+          transform var(--speed3) cubic-bezier(0.34, 1.56, 0.64, 1),
+          visibility var(--speed3);
+      }
+
+      .dropdown-menu.open {
+        opacity: 1;
+        visibility: visible;
+        transform: scale(1) translateY(0);
+      }
+
+      /* positioning="body" promotes the menu to the browser's top layer.
 			   Reset the Popover UA box while retaining Shadow DOM styles. */
-			.dropdown-menu[popover] {
-				margin: 0;
-				border: 0;
-			}
-
-			.dropdown-menu.placement-top {
-				top: auto;
-				bottom: 100%;
-				margin-top: 0;
-				margin-bottom: 4px;
-				transform-origin: bottom;
-				transform: scale(0.95) translateY(8px);
-			}
-
-			.dropdown-menu.placement-top.open {
-				transform: scale(1) translateY(0);
-			}
-
-			.dropdown-menu.placement-left {
-				top: 0;
-				left: auto;
-				right: 100%;
-				margin-top: 0;
-				margin-right: 4px;
-				transform-origin: right center;
-				transform: scale(0.95) translateX(8px);
-			}
-
-			.dropdown-menu.placement-left.open {
-				transform: scale(1) translateX(0);
-			}
-
-			.dropdown-menu.placement-right {
-				top: 0;
-				left: 100%;
-				right: auto;
-				margin-top: 0;
-				margin-left: 4px;
-				transform-origin: left center;
-				transform: scale(0.95) translateX(-8px);
-			}
-
-			.dropdown-menu.placement-right.open {
-				transform: scale(1) translateX(0);
-			}
-
-			.dropdown-menu.open.scrollable {
-				overflow-x: hidden;
-				overflow-y: auto;
-				overscroll-behavior: contain;
-			}
-
-			/* Desktop category flyouts need visible overflow. If the root list no
+      .dropdown-menu[popover] {
+        margin: 0;
+        border: 0;
+      }
+
+      .dropdown-menu.placement-top {
+        top: auto;
+        bottom: 100%;
+        margin-top: 0;
+        margin-bottom: 4px;
+        transform-origin: bottom;
+        transform: scale(0.95) translateY(8px);
+      }
+
+      .dropdown-menu.placement-top.open {
+        transform: scale(1) translateY(0);
+      }
+
+      .dropdown-menu.placement-left {
+        top: 0;
+        left: auto;
+        right: 100%;
+        margin-top: 0;
+        margin-right: 4px;
+        transform-origin: right center;
+        transform: scale(0.95) translateX(8px);
+      }
+
+      .dropdown-menu.placement-left.open {
+        transform: scale(1) translateX(0);
+      }
+
+      .dropdown-menu.placement-right {
+        top: 0;
+        left: 100%;
+        right: auto;
+        margin-top: 0;
+        margin-left: 4px;
+        transform-origin: left center;
+        transform: scale(0.95) translateX(-8px);
+      }
+
+      .dropdown-menu.placement-right.open {
+        transform: scale(1) translateX(0);
+      }
+
+      .dropdown-menu.open.scrollable {
+        overflow-x: hidden;
+        overflow-y: auto;
+        overscroll-behavior: contain;
+      }
+
+      /* Desktop category flyouts need visible overflow. If the root list no
 			   longer fits, the component switches to the inline drilldown layout. */
-			.dropdown-menu.open:not(.scrollable) {
-				overflow: visible;
-			}
-
-			/* Bottom sheet drawer styles */
-			.sheet-backdrop {
-				position: fixed;
-				inset: 0;
-				z-index: 1000;
-				background-color: rgba(0, 0, 0, 0.4);
-				opacity: 0;
-				visibility: hidden;
-				transition: opacity var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1), visibility var(--speed3);
-				display: flex;
-				flex-direction: column;
-				justify-content: flex-end;
-			}
-
-			.sheet-backdrop.open {
-				opacity: 1;
-				visibility: visible;
-			}
-
-			.sheet-drawer {
-				background-color: var(--surface-container);
-				border-radius: 1.75rem 1.75rem 0 0;
-				box-shadow: var(--elevate3);
-				max-height: 70vh;
-				display: flex;
-				flex-direction: column;
-				transform: translateY(100%);
-				transition: transform var(--speed3) cubic-bezier(0.16, 1, 0.3, 1);
-				padding: 16px 0;
-			}
-
-			.sheet-drawer.open {
-				transform: translateY(0);
-			}
-
-			.sheet-handle {
-				width: 40px;
-				height: 4px;
-				background-color: var(--outline-variant);
-				border-radius: 2px;
-				margin: 0 auto 16px;
-			}
-
-			.sheet-title {
-				padding: 0 24px 8px;
-				font-size: 1.125rem;
-				font-weight: 700;
-				color: var(--on-surface);
-			}
-
-			.sheet-search-wrapper {
-				padding: 0 16px 12px;
-			}
-
-			.sheet-search-input {
-				width: 100%;
-				box-sizing: border-box;
-				padding: 10px 16px;
-				border: 1px solid var(--outline);
-				border-radius: 9999px;
-				background: var(--surface-container-high);
-				color: var(--on-surface);
-				font-size: 1rem;
-				outline: none;
-			}
-
-			.sheet-search-input:focus {
-				border-color: var(--primary);
-			}
-
-			.sheet-options-list {
-				list-style: none;
-				padding: 0;
-				margin: 0;
-				overflow-y: auto;
-				flex: 1;
-			}
-
-			/* Animated Drilldown Slide Layout */
-			.drilldown-wrapper {
-				width: 100%;
-				overflow: hidden;
-				position: relative;
-				transition: height var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1);
-			}
-
-			.drilldown-track {
-				display: flex;
-				width: 200%;
-				transition: transform var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1);
-			}
-
-			.drilldown-track.slide-active {
-				transform: translateX(-50%);
-			}
-
-			.drilldown-panel {
-				width: 50%;
-				box-sizing: border-box;
-				list-style: none;
-				padding: 0;
-				margin: 0;
-				flex-shrink: 0;
-			}
-
-			.drilldown-panel.panel-active {
-				max-height: none;
-			}
-
-			.drilldown-panel.panel-inactive {
-				max-height: 0;
-				overflow: hidden;
-			}
-
-			/* Group / Subcategory header (Browsing mode - acts as a hover trigger for submenus) */
-			.group-header {
-				padding: 8px 16px;
-				font-size: 0.875rem;
-				font-weight: 500;
-				color: var(--on-surface);
-				cursor: pointer;
-				display: flex;
-				align-items: center;
-				position: relative;
-				user-select: none;
-				transition: background-color var(--speed2) ease, color var(--speed2) ease;
-			}
-
-			.group-header:hover,
-			.group-header.active {
-				background-color: var(--surface-container-high);
-				color: var(--primary);
-			}
-
-			/* Inline header (Searching mode & Sheet mode - flat layout) */
-			.group-header-flat {
-				padding: 6px 16px;
-				font-size: 0.75rem;
-				font-weight: 700;
-				text-transform: uppercase;
-				color: var(--primary);
-				letter-spacing: 0.05em;
-				background-color: var(--surface-container-low);
-				user-select: none;
-			}
-
-			/* Hierarchical sub-menu with premium flyout animation */
-			.submenu {
-				display: block;
-				opacity: 0;
-				visibility: hidden;
-				position: absolute;
-				top: 0;
-				/* Intermediate flyouts must keep overflow visible so deeper
+      .dropdown-menu.open:not(.scrollable) {
+        overflow: visible;
+      }
+
+      /* Bottom sheet drawer styles */
+      .sheet-backdrop {
+        position: fixed;
+        inset: 0;
+        z-index: 1000;
+        background-color: rgba(0, 0, 0, 0.4);
+        opacity: 0;
+        visibility: hidden;
+        transition:
+          opacity var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1),
+          visibility var(--speed3);
+        display: flex;
+        flex-direction: column;
+        justify-content: flex-end;
+      }
+
+      .sheet-backdrop.open {
+        opacity: 1;
+        visibility: visible;
+      }
+
+      .sheet-drawer {
+        background-color: var(--surface-container);
+        border-radius: 1.75rem 1.75rem 0 0;
+        box-shadow: var(--elevate3);
+        max-height: 70vh;
+        display: flex;
+        flex-direction: column;
+        transform: translateY(100%);
+        transition: transform var(--speed3) cubic-bezier(0.16, 1, 0.3, 1);
+        padding: 16px 0;
+      }
+
+      .sheet-drawer.open {
+        transform: translateY(0);
+      }
+
+      .sheet-handle {
+        width: 40px;
+        height: 4px;
+        background-color: var(--outline-variant);
+        border-radius: 2px;
+        margin: 0 auto 16px;
+      }
+
+      .sheet-title {
+        padding: 0 24px 8px;
+        font-size: 1.125rem;
+        font-weight: 700;
+        color: var(--on-surface);
+      }
+
+      .sheet-search-wrapper {
+        padding: 0 16px 12px;
+      }
+
+      .sheet-search-input {
+        width: 100%;
+        box-sizing: border-box;
+        padding: 10px 16px;
+        border: 1px solid var(--outline);
+        border-radius: 9999px;
+        background: var(--surface-container-high);
+        color: var(--on-surface);
+        font-size: 1rem;
+        outline: none;
+      }
+
+      .sheet-search-input:focus {
+        border-color: var(--primary);
+      }
+
+      .sheet-options-list {
+        list-style: none;
+        padding: 0;
+        margin: 0;
+        overflow-y: auto;
+        flex: 1;
+      }
+
+      /* Animated Drilldown Slide Layout */
+      .drilldown-wrapper {
+        width: 100%;
+        overflow: hidden;
+        position: relative;
+        transition: height var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1);
+      }
+
+      .drilldown-track {
+        display: flex;
+        width: 200%;
+        transition: transform var(--speed3) cubic-bezier(0.2, 0.8, 0.2, 1);
+      }
+
+      .drilldown-track.slide-active {
+        transform: translateX(-50%);
+      }
+
+      .drilldown-panel {
+        width: 50%;
+        box-sizing: border-box;
+        list-style: none;
+        padding: 0;
+        margin: 0;
+        flex-shrink: 0;
+      }
+
+      .drilldown-panel.panel-active {
+        max-height: none;
+      }
+
+      .drilldown-panel.panel-inactive {
+        max-height: 0;
+        overflow: hidden;
+      }
+
+      /* Group / Subcategory header (Browsing mode - acts as a hover trigger for submenus) */
+      .group-header {
+        padding: 8px 16px;
+        font-size: 0.875rem;
+        font-weight: 500;
+        color: var(--on-surface);
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        position: relative;
+        user-select: none;
+        transition:
+          background-color var(--speed2) ease,
+          color var(--speed2) ease;
+      }
+
+      .group-header:hover,
+      .group-header.active {
+        background-color: var(--surface-container-high);
+        color: var(--primary);
+      }
+
+      /* Inline header (Searching mode & Sheet mode - flat layout) */
+      .group-header-flat {
+        padding: 6px 16px;
+        font-size: 0.75rem;
+        font-weight: 700;
+        text-transform: uppercase;
+        color: var(--primary);
+        letter-spacing: 0.05em;
+        background-color: var(--surface-container-low);
+        user-select: none;
+      }
+
+      /* Hierarchical sub-menu with premium flyout animation */
+      .submenu {
+        display: block;
+        opacity: 0;
+        visibility: hidden;
+        position: absolute;
+        top: 0;
+        /* Intermediate flyouts must keep overflow visible so deeper
 				   subcategories are never clipped. Oversized trees switch to the
 				   scrollable inline drilldown layout before rendering. */
-				overflow: visible;
-				background-color: var(--surface-container-highest);
-				box-shadow: var(--elevate3);
-				border-radius: 0.5rem;
-				padding: 4px 0;
-				list-style: none;
-				min-width: 160px;
-				z-index: 110;
-				transition: 
-					opacity var(--speed2) cubic-bezier(0.2, 0.8, 0.2, 1), 
-					transform var(--speed2) cubic-bezier(0.34, 1.56, 0.64, 1), 
-					visibility var(--speed2);
-			}
-
-			.submenu.open-right {
-				left: 100%;
-				margin-left: 2px;
-				transform: scale(0.9) translateX(-10px);
-				transform-origin: top left;
-			}
-
-			.submenu.open-left {
-				right: 100%;
-				margin-right: 2px;
-				transform: scale(0.9) translateX(10px);
-				transform-origin: top right;
-			}
-
-			.group-header:hover > .submenu.active,
-			.group-header.active > .submenu.active {
-				opacity: 1;
-				visibility: visible;
-				transform: scale(1) translateX(0);
-			}
-
-			.option-item {
-				cursor: pointer;
-				padding: 8px 16px;
-				font-size: 0.875rem;
-				color: var(--on-surface);
-				display: flex;
-				align-items: center;
-				transition: background-color var(--speed2) ease;
-			}
-
-			.option-item:hover,
-			.option-item.active-nav {
-				background-color: var(--surface-container-high);
-			}
-
-			.option-item.selected {
-				background-color: var(--tertiary-container);
-				color: var(--on-tertiary-container);
-				font-weight: 500;
-			}
-
-			.option-item.disabled {
-				opacity: 0.5;
-				pointer-events: none;
-			}
-
-			.no-options {
-				padding: 12px 16px;
-				font-size: 0.875rem;
-				color: var(--outline);
-				text-align: center;
-			}
-		`]}connectedCallback(){super.connectedCallback(),document.addEventListener(`click`,this._handleOutsideClick),document.addEventListener(`moni-select-open`,this._handlePeerOpen),window.addEventListener(`scroll`,this._handleScroll,{capture:!0}),window.addEventListener(`resize`,this._handleResize),window.visualViewport?.addEventListener(`scroll`,this._handleScroll),window.visualViewport?.addEventListener(`resize`,this._handleResize)}disconnectedCallback(){this._hideBodyPopover(),super.disconnectedCallback(),document.removeEventListener(`click`,this._handleOutsideClick),document.removeEventListener(`moni-select-open`,this._handlePeerOpen),window.removeEventListener(`scroll`,this._handleScroll,{capture:!0}),window.removeEventListener(`resize`,this._handleResize),window.visualViewport?.removeEventListener(`scroll`,this._handleScroll),window.visualViewport?.removeEventListener(`resize`,this._handleResize)}updated(e){super.updated(e),e.has(`value`)&&this._internals?.setFormValue?.(this.value),this._syncValidity(),(e.has(`_open`)||e.has(`_drilldownPath`)||e.has(`_searchQuery`)||e.has(`_useInlineCategories`)||e.has(`_parsedOptions`))&&this._updateWrapperHeight(),this._open&&(e.has(`positioning`)||e.has(`placement`)||e.has(`dropdownWidth`)||e.has(`dropdownMaxHeight`))&&this._updateMenuPosition(),(e.has(`_open`)||e.has(`positioning`)||e.has(`sheet`))&&this._syncBodyPopover()}_updateWrapperHeight(){let e=this.shadowRoot?.querySelector(`.drilldown-wrapper`);if(e){if(!this._open||this.sheet){e.style.height=``;return}requestAnimationFrame(()=>{let t=this.shadowRoot?.querySelector(`.drilldown-panel.panel-active`);t?e.style.height=`${t.scrollHeight}px`:e.style.height=``})}}_syncBodyPopover(){let e=this._menu;if(!e||typeof e.showPopover!=`function`)return;let t=this._open&&!this.sheet&&this.positioning===`body`;try{let n=e.matches(`:popover-open`);t&&!n?e.showPopover():!t&&n&&e.hidePopover()}catch{}}_hideBodyPopover(){let e=this._menu;if(!(!e||typeof e.hidePopover!=`function`))try{e.matches(`:popover-open`)&&e.hidePopover()}catch{}}_getViewportMetrics(){let e=window.visualViewport,t=e?.offsetTop??0,n=e?.offsetLeft??0,r=e?.height??window.innerHeight,i=e?.width??window.innerWidth;return{top:t,left:n,height:r,width:i,bottom:t+r,right:n+i}}_getDirectionalAvailableHeight(e,t){let n=this._getViewportMetrics(),r=n.height*.75;if(e===`bottom`){let e=n.bottom-t.bottom-8,i=t.bottom-n.top+8;return Math.max(0,Math.floor(Math.min(r,e,r-i)))}let i=t.top-n.top-8,a=n.bottom-t.top+8;return Math.max(0,Math.floor(Math.min(r,i,r-a)))}_normalizeManualMaxHeight(){let e=this.dropdownMaxHeight.trim();if(!e)return``;let t=/^\d+(?:\.\d+)?$/.test(e)?`${e}px`:e;return typeof CSS<`u`&&typeof CSS.supports==`function`&&!CSS.supports(`max-height`,t)?``:t}_resolveManualMaxHeightPx(e,t){let n=e.match(/^(\d+(?:\.\d+)?)(px|vh|dvh|svh|lvh|%|rem)$/i);if(!n)return null;let r=Number(n[1]),i=n[2].toLowerCase();return i===`px`?r:i===`rem`?r*(Number.parseFloat(getComputedStyle(document.documentElement).fontSize)||16):r/100*t}_getMenuHeightConstraint(e,t=this._actualPlacement){let n=this._getViewportMetrics(),r=t===`top`||t===`bottom`?this._getDirectionalAvailableHeight(t,e):Math.max(0,Math.floor(Math.min(n.height*.75,n.height-16))),i=this._normalizeManualMaxHeight(),a=i?this._resolveManualMaxHeightPx(i,n.height):null,o=a===null?r:Math.min(r,a);return{css:i?`min(${r}px, ${i})`:`${r}px`,px:Math.max(0,o)}}_estimateDesiredMenuHeight(){let e=this._getViewportMetrics(),t=this._searchQuery?this._getFilteredOptions().length:this._parsedOptions.length,n=Math.min(e.height*.75,Math.max(48,t*40+8)),r=this._normalizeManualMaxHeight(),i=r?this._resolveManualMaxHeightPx(r,e.height):null;return i!==null&&(n=Math.min(n,i)),n}_getGroupDepth(e){return e.reduce((e,t)=>t.type===`option`?e:Math.max(e,1+this._getGroupDepth(t.children)),0)}_hasOversizedGroupPanel(e,t){return e.some(e=>e.type===`option`?!1:e.children.length*40+8>t||this._hasOversizedGroupPanel(e.children,t))}_getAvailableFlyoutWidth(e){let t=this._getViewportMetrics(),n=t.left,r=t.right;if(this.positioning!==`body`){let e=this;for(;e;){let t=e.parentNode instanceof ShadowRoot?e.parentNode.host:e.parentNode;if(t instanceof HTMLElement){let e=getComputedStyle(t);if(/(auto|scroll|hidden|clip)/.test(e.overflowX)){let e=t.getBoundingClientRect();n=Math.max(n,e.left),r=Math.min(r,e.right)}}e=t}}return Math.max(0,Math.max(r-e.right,e.left-n))}_determineActualPlacement(){if(this.sheet){this._actualPlacement=`bottom`;return}let e=this.getBoundingClientRect(),t=this._getViewportMetrics(),n=this._getDirectionalAvailableHeight(`bottom`,e),r=this._getDirectionalAvailableHeight(`top`,e),i=t.right-e.right,a=e.left-t.left,o=this._estimateDesiredMenuHeight(),s=this.placement;s===`auto`&&(s=n>=o?`bottom`:r>n?`top`:`bottom`),s===`top`?this._actualPlacement=r<o&&n>r?`bottom`:`top`:s===`bottom`?this._actualPlacement=n<o&&r>n?`top`:`bottom`:s===`left`?this._actualPlacement=a<180&&i>a?`right`:`left`:s===`right`&&(this._actualPlacement=i<180&&a>i?`left`:`right`)}_updateMenuPosition(){if(!this._open||this.sheet)return;this._determineActualPlacement();let e=this.getBoundingClientRect(),t=this._getViewportMetrics(),n=this._getMenuHeightConstraint(e);this._menuMaxHeight=n.css;let r=this._parsedOptions.some(e=>e.type===`group`),i=this._parsedOptions.length*40+8,a=this._getGroupDepth(this._parsedOptions)*160,o=this._getAvailableFlyoutWidth(e),s=t.width<600||r&&o<a,c=r&&(i>n.px||this._hasOversizedGroupPanel(this._parsedOptions,n.px));if(this._useInlineCategories=s||c,this.positioning!==`fixed`&&this.positioning!==`body`){this._menuStyle=``;return}let l=``;if(l=this.dropdownWidth===`trigger`?`width: ${e.width}px;`:this.dropdownWidth===`auto`?`width: auto; min-width: 160px; max-width: 320px;`:`width: ${this.dropdownWidth};`,this._actualPlacement===`top`)this._menuStyle=`
+        overflow: visible;
+        background-color: var(--surface-container-highest);
+        box-shadow: var(--elevate3);
+        border-radius: 0.5rem;
+        padding: 4px 0;
+        list-style: none;
+        min-width: 160px;
+        z-index: 110;
+        transition:
+          opacity var(--speed2) cubic-bezier(0.2, 0.8, 0.2, 1),
+          transform var(--speed2) cubic-bezier(0.34, 1.56, 0.64, 1),
+          visibility var(--speed2);
+      }
+
+      .submenu.open-right {
+        left: 100%;
+        margin-left: 2px;
+        transform: scale(0.9) translateX(-10px);
+        transform-origin: top left;
+      }
+
+      .submenu.open-left {
+        right: 100%;
+        margin-right: 2px;
+        transform: scale(0.9) translateX(10px);
+        transform-origin: top right;
+      }
+
+      .group-header:hover > .submenu.active,
+      .group-header.active > .submenu.active {
+        opacity: 1;
+        visibility: visible;
+        transform: scale(1) translateX(0);
+      }
+
+      .option-item {
+        cursor: pointer;
+        padding: 8px 16px;
+        font-size: 0.875rem;
+        color: var(--on-surface);
+        display: flex;
+        align-items: center;
+        transition: background-color var(--speed2) ease;
+      }
+
+      .option-item:hover,
+      .option-item.active-nav {
+        background-color: var(--surface-container-high);
+      }
+
+      .option-item.selected {
+        background-color: var(--tertiary-container);
+        color: var(--on-tertiary-container);
+        font-weight: 500;
+      }
+
+      .option-item.disabled {
+        opacity: 0.5;
+        pointer-events: none;
+      }
+
+      .no-options {
+        padding: 12px 16px;
+        font-size: 0.875rem;
+        color: var(--outline);
+        text-align: center;
+      }
+    `]}connectedCallback(){super.connectedCallback(),document.addEventListener(`click`,this._handleOutsideClick),document.addEventListener(`moni-select-open`,this._handlePeerOpen),window.addEventListener(`scroll`,this._handleScroll,{capture:!0}),window.addEventListener(`resize`,this._handleResize),window.visualViewport?.addEventListener(`scroll`,this._handleScroll),window.visualViewport?.addEventListener(`resize`,this._handleResize)}disconnectedCallback(){this._hideBodyPopover(),super.disconnectedCallback(),document.removeEventListener(`click`,this._handleOutsideClick),document.removeEventListener(`moni-select-open`,this._handlePeerOpen),window.removeEventListener(`scroll`,this._handleScroll,{capture:!0}),window.removeEventListener(`resize`,this._handleResize),window.visualViewport?.removeEventListener(`scroll`,this._handleScroll),window.visualViewport?.removeEventListener(`resize`,this._handleResize)}updated(e){super.updated(e),e.has(`value`)&&this._internals?.setFormValue?.(this.value),this._syncValidity(),(e.has(`_open`)||e.has(`_drilldownPath`)||e.has(`_searchQuery`)||e.has(`_useInlineCategories`)||e.has(`_parsedOptions`))&&this._updateWrapperHeight(),this._open&&(e.has(`positioning`)||e.has(`placement`)||e.has(`dropdownWidth`)||e.has(`dropdownMaxHeight`))&&this._updateMenuPosition(),(e.has(`_open`)||e.has(`positioning`)||e.has(`sheet`))&&this._syncBodyPopover()}_updateWrapperHeight(){let e=this.shadowRoot?.querySelector(`.drilldown-wrapper`);if(e){if(!this._open||this.sheet){e.style.height=``;return}requestAnimationFrame(()=>{let t=this.shadowRoot?.querySelector(`.drilldown-panel.panel-active`);t?e.style.height=`${t.scrollHeight}px`:e.style.height=``})}}_syncBodyPopover(){let e=this._menu;if(!e||typeof e.showPopover!=`function`)return;let t=this._open&&!this.sheet&&this.positioning===`body`;try{let n=e.matches(`:popover-open`);t&&!n?e.showPopover():!t&&n&&e.hidePopover()}catch{}}_hideBodyPopover(){let e=this._menu;if(!(!e||typeof e.hidePopover!=`function`))try{e.matches(`:popover-open`)&&e.hidePopover()}catch{}}_getViewportMetrics(){let e=window.visualViewport,t=e?.offsetTop??0,n=e?.offsetLeft??0,r=e?.height??window.innerHeight,i=e?.width??window.innerWidth;return{top:t,left:n,height:r,width:i,bottom:t+r,right:n+i}}_getDirectionalAvailableHeight(e,t){let n=this._getViewportMetrics(),r=n.height*.75;if(e===`bottom`){let e=n.bottom-t.bottom-8,i=t.bottom-n.top+8;return Math.max(0,Math.floor(Math.min(r,e,r-i)))}let i=t.top-n.top-8,a=n.bottom-t.top+8;return Math.max(0,Math.floor(Math.min(r,i,r-a)))}_normalizeManualMaxHeight(){let e=this.dropdownMaxHeight.trim();if(!e)return``;let t=/^\d+(?:\.\d+)?$/.test(e)?`${e}px`:e;return typeof CSS<`u`&&typeof CSS.supports==`function`&&!CSS.supports(`max-height`,t)?``:t}_resolveManualMaxHeightPx(e,t){let n=e.match(/^(\d+(?:\.\d+)?)(px|vh|dvh|svh|lvh|%|rem)$/i);if(!n)return null;let r=Number(n[1]),i=n[2].toLowerCase();return i===`px`?r:i===`rem`?r*(Number.parseFloat(getComputedStyle(document.documentElement).fontSize)||16):r/100*t}_getMenuHeightConstraint(e,t=this._actualPlacement){let n=this._getViewportMetrics(),r=t===`top`||t===`bottom`?this._getDirectionalAvailableHeight(t,e):Math.max(0,Math.floor(Math.min(n.height*.75,n.height-16))),i=this._normalizeManualMaxHeight(),a=i?this._resolveManualMaxHeightPx(i,n.height):null,o=a===null?r:Math.min(r,a);return{css:i?`min(${r}px, ${i})`:`${r}px`,px:Math.max(0,o)}}_estimateDesiredMenuHeight(){let e=this._getViewportMetrics(),t=this._searchQuery?this._getFilteredOptions().length:this._parsedOptions.length,n=Math.min(e.height*.75,Math.max(48,t*40+8)),r=this._normalizeManualMaxHeight(),i=r?this._resolveManualMaxHeightPx(r,e.height):null;return i!==null&&(n=Math.min(n,i)),n}_getGroupDepth(e){return e.reduce((e,t)=>t.type===`option`?e:Math.max(e,1+this._getGroupDepth(t.children)),0)}_hasOversizedGroupPanel(e,t){return e.some(e=>e.type===`option`?!1:e.children.length*40+8>t||this._hasOversizedGroupPanel(e.children,t))}_getAvailableFlyoutWidth(e){let t=this._getViewportMetrics(),n=t.left,r=t.right;if(this.positioning!==`body`){let e=this;for(;e;){let t=e.parentNode instanceof ShadowRoot?e.parentNode.host:e.parentNode;if(t instanceof HTMLElement){let e=getComputedStyle(t);if(/(auto|scroll|hidden|clip)/.test(e.overflowX)){let e=t.getBoundingClientRect();n=Math.max(n,e.left),r=Math.min(r,e.right)}}e=t}}return Math.max(0,Math.max(r-e.right,e.left-n))}_determineActualPlacement(){if(this.sheet){this._actualPlacement=`bottom`;return}let e=this.getBoundingClientRect(),t=this._getViewportMetrics(),n=this._getDirectionalAvailableHeight(`bottom`,e),r=this._getDirectionalAvailableHeight(`top`,e),i=t.right-e.right,a=e.left-t.left,o=this._estimateDesiredMenuHeight(),s=this.placement;s===`auto`&&(s=n>=o?`bottom`:r>n?`top`:`bottom`),s===`top`?this._actualPlacement=r<o&&n>r?`bottom`:`top`:s===`bottom`?this._actualPlacement=n<o&&r>n?`top`:`bottom`:s===`left`?this._actualPlacement=a<180&&i>a?`right`:`left`:s===`right`&&(this._actualPlacement=i<180&&a>i?`left`:`right`)}_updateMenuPosition(){if(!this._open||this.sheet)return;this._determineActualPlacement();let e=this.getBoundingClientRect(),t=this._getViewportMetrics(),n=this._getMenuHeightConstraint(e);this._menuMaxHeight=n.css;let r=this._parsedOptions.some(e=>e.type===`group`),i=this._parsedOptions.length*40+8,a=this._getGroupDepth(this._parsedOptions)*160,o=this._getAvailableFlyoutWidth(e),s=t.width<600||r&&o<a,c=r&&(i>n.px||this._hasOversizedGroupPanel(this._parsedOptions,n.px));if(this._useInlineCategories=s||c,this.positioning!==`fixed`&&this.positioning!==`body`){this._menuStyle=``;return}let l=``;if(l=this.dropdownWidth===`trigger`?`width: ${e.width}px;`:this.dropdownWidth===`auto`?`width: auto; min-width: 160px; max-width: 320px;`:`width: ${this.dropdownWidth};`,this._actualPlacement===`top`)this._menuStyle=`
 				position: fixed;
 				bottom: ${window.innerHeight-e.top}px;
 				left: ${e.left}px;
@@ -359,147 +363,182 @@ import{a as e,c as t,d as n,i as r,m as i,n as a,o,r as s,s as c,t as l}from"../
 					right: auto;
 					bottom: auto;
 				`}}_getMenuStyle(){let e=`max-height: ${this._menuMaxHeight}; --_select-menu-max-height: ${this._menuMaxHeight};`;return this.positioning===`fixed`||this.positioning===`body`?`${this._menuStyle} ${e}`:this.dropdownWidth===`auto`?`width: max-content; min-width: 160px; max-width: 320px; ${e}`:this.dropdownWidth===`trigger`?e:`width: ${this.dropdownWidth}; ${e}`}_onSlotChange(){if(!this._slot)return;let e=this._slot.assignedElements({flatten:!0}),t=[],n=(e,t)=>{let n=e.find(e=>e.type===`group`&&e.label===t);return n||(n={type:`group`,label:t,children:[]},e.push(n)),n},r=(e,t,r)=>{let i=e;r.length>0&&(t.group=r.join(` / `)),r.forEach(e=>{i=n(i,e).children}),i.push(t)},i=(e,n)=>{let a=e.tagName.toLowerCase();if(a===`option`||a===`moni-select-option`){let i={type:`option`,value:e.getAttribute(`value`)||``,label:e.textContent?.trim()||e.getAttribute(`label`)||e.getAttribute(`value`)||``,disabled:e.hasAttribute(`disabled`),element:e},a=e.getAttribute(`group`),o=a?a.split(`/`).map(e=>e.trim()).filter(Boolean):[],s=[...n,...o];r(t,i,s)}else if(a===`optgroup`){let t=e.getAttribute(`label`)||``,r=[...n,t];Array.from(e.children).forEach(e=>i(e,r))}};e.forEach(e=>i(e,[])),this._parsedOptions=t,this.requestUpdate()}_toggleDropdown(e){e&&e.stopPropagation(),!this.disabled&&(this._open?this._closeDropdown():this._openDropdown())}_onInputClick(e){this.disabled||(this.searchable&&!this.sheet?this._open||this._openDropdown():this._toggleDropdown(e))}_openDropdown(){this.disabled||this._open||(this._open=!0,this._activeIndex=-1,this._drilldownPath=[],this._searchQuery=``,d(this,`moni-select-open`,{detail:{item:this}}),this._updateMenuPosition(),this.searchable&&setTimeout(()=>{this._open&&(this._input&&!this.sheet?this._input.focus():this.sheet&&(this.shadowRoot?.querySelector(`.sheet-search-input`))?.focus())},50))}_closeDropdown(){this._open&&(this._open=!1,this._searchQuery=``,this._hideBodyPopover())}_findOptionByValue(e){return this._getFlatOptions(this._parsedOptions).find(t=>t.value===e)}_onSearchInput(e){let t=e.target.value;if(this._open||this._openDropdown(),this._searchQuery=t,this._activeIndex=-1,this.clearable&&t.trim()===``){this.value=``,d(this,`moni-change`,{detail:{value:this.value,originalEvent:e}});return}let n=this._getFlatOptions(this._parsedOptions).find(e=>e.label.toLowerCase()===t.trim().toLowerCase());n&&!n.disabled&&this._selectOption(n)}_selectOption(e){e.disabled||(this.value=e.value,this._closeDropdown(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0})),d(this,`moni-change`,{detail:{value:this.value}}))}_onSubmenuMouseEnter(e){let t=e.currentTarget,n=t.querySelector(`:scope > .submenu`);if(!n)return;let r=t.getBoundingClientRect(),i=window.innerWidth-r.right,a=r.left;i<160&&a>i?(n.classList.remove(`open-right`),n.classList.add(`open-left`)):(n.classList.remove(`open-left`),n.classList.add(`open-right`))}_onKeyDown(e){if(this.disabled)return;let t=this._getVisibleOptions();e.key===`ArrowDown`?(e.preventDefault(),this._open?t.length>0&&(this._activeIndex=(this._activeIndex+1)%t.length,this._scrollToActive()):this._openDropdown()):e.key===`ArrowUp`?(e.preventDefault(),this._open&&t.length>0&&(this._activeIndex=(this._activeIndex-1+t.length)%t.length,this._scrollToActive())):e.key===`Enter`?(e.preventDefault(),this._open?this._activeIndex>=0&&this._activeIndex<t.length&&this._selectOption(t[this._activeIndex]):this._openDropdown()):e.key===`Escape`&&(e.preventDefault(),this._closeDropdown())}_scrollToActive(){setTimeout(()=>{let e=this.shadowRoot?.querySelector(`.option-item.active-nav`);e&&e.scrollIntoView({block:`nearest`})},0)}_getFlatOptions(e){let t=[],n=e=>{e.type===`option`?t.push(e):e.children.forEach(n)};return e.forEach(n),t}_getFilteredOptions(){let e=this._getFlatOptions(this._parsedOptions);if(!this._searchQuery)return e;let t=this._searchQuery.toLowerCase();return e.filter(e=>e.label.toLowerCase().includes(t)||e.value.toLowerCase().includes(t))}_getVisibleOptions(){let e=this._getFilteredOptions();return this._searchQuery?e:this.sheet||this._useInlineCategories?this._drilldownPath.length>0?this._drilldownPath[this._drilldownPath.length-1].children.filter(e=>e.type===`option`):this._parsedOptions.filter(e=>e.type===`option`):e}_renderRootList(){let e=0;return this._parsedOptions.map(t=>{if(t.type===`option`){let r=e++,i=t.value===this.value,a=this._drilldownPath.length===0&&r===this._activeIndex;return n`
-					<li
-						class="option-item ${i?`selected`:``} ${a?`active-nav`:``} ${t.disabled?`disabled`:``}"
-						@click=${()=>this._selectOption(t)}
-					>
-						${t.label}
-					</li>
-				`}return n`
-				<li class="group-header" @click=${e=>{e.stopPropagation(),this._drilldownPath=[...this._drilldownPath,t]}}>
-					<span>${t.label}</span>
-					<moni-icon name="chevron_right" style="margin-inline-start: auto; font-size: 1.125rem;"></moni-icon>
-				</li>
-			`})}_renderSubcategoryList(){if(this._drilldownPath.length===0)return t;let e=this._drilldownPath[this._drilldownPath.length-1],r=0;return n`
-			<li class="group-header" @click=${e=>{e.stopPropagation(),this._drilldownPath=this._drilldownPath.slice(0,-1)}}>
-				<moni-icon name="arrow_back" style="font-size: 1.25rem; margin-inline-end: 8px;"></moni-icon>
-				<span>Regresar</span>
-			</li>
-			<li class="group-header-flat">${e.label}</li>
-			${e.children.map(e=>{if(e.type===`option`){let t=r++,i=e.value===this.value,a=this._drilldownPath.length>0&&t===this._activeIndex;return n`
-						<li
-							class="option-item ${i?`selected`:``} ${a?`active-nav`:``} ${e.disabled?`disabled`:``}"
-							@click=${()=>this._selectOption(e)}
-						>
-							${e.label}
-						</li>
-					`}return n`
-					<li class="group-header" @click=${t=>{t.stopPropagation(),this._drilldownPath=[...this._drilldownPath,e]}}>
-						<span>${e.label}</span>
-						<moni-icon name="chevron_right" style="margin-inline-start: auto; font-size: 1.125rem;"></moni-icon>
-					</li>
-				`})}
-		`}_renderDesktopNode(e,t){if(e.type===`option`){let r=t.value++,i=e.value===this.value,a=r===this._activeIndex;return n`
-				<li
-					class="option-item ${i?`selected`:``} ${a?`active-nav`:``} ${e.disabled?`disabled`:``}"
-					@click=${()=>this._selectOption(e)}
-				>
-					${e.label}
-				</li>
-			`}return n`
-			<li 
-				class="group-header"
-				@mouseenter=${this._onSubmenuMouseEnter}
-				@click=${e=>e.stopPropagation()}
-			>
-				<span>${e.label}</span>
-				<moni-icon name="chevron_right" style="margin-inline-start: auto; font-size: 1.125rem;"></moni-icon>
-				
-				<ul class="submenu active open-right">
-					${e.children.map(e=>this._renderDesktopNode(e,t))}
-				</ul>
-			</li>
-		`}_renderOptionsList(e){if(this._parsedOptions.length===0)return n`<li class="no-options">No options found</li>`;if(this._searchQuery){let r={};e.forEach(e=>{let t=e.group||``;r[t]||(r[t]=[]),r[t].push(e)});let i=0;return Object.entries(r).map(([e,r])=>n`
-				${e?n`<li class="group-header-flat">${e}</li>`:t}
-				${r.map(e=>{let t=i++,r=e.value===this.value,a=t===this._activeIndex;return n`
-						<li
-							class="option-item ${r?`selected`:``} ${a?`active-nav`:``} ${e.disabled?`disabled`:``}"
-							@click=${()=>this._selectOption(e)}
-						>
-							${e.label}
-						</li>
-					`})}
-			`)}if(this.sheet||this._useInlineCategories){let e=this._drilldownPath.length===0,t=!e;return n`
-				<div class="drilldown-wrapper">
-					<div class="drilldown-track ${this._drilldownPath.length>0?`slide-active`:``}">
-						<ul class="drilldown-panel ${e?`panel-active`:`panel-inactive`}">
-							${this._renderRootList()}
-						</ul>
-						<ul class="drilldown-panel ${t?`panel-active`:`panel-inactive`}">
-							${this._renderSubcategoryList()}
-						</ul>
-					</div>
-				</div>
-			`}let r={value:0};return this._parsedOptions.map(e=>this._renderDesktopNode(e,r))}render(){let e=!!this.icon,r=this._getFilteredOptions(),i=this._findOptionByValue(this.value),a=this._open&&this.searchable&&!this.sheet?this._searchQuery:i?i.label:``,o=!!(a||this.placeholder),s={field:!0,label:!!this.label,fill:this.variant===`filled`,border:this.variant===`outlined`,small:this.size===`small`,large:this.size===`large`,extra:this.size===`extra`,prefix:e,suffix:!0,invalid:this.error,round:this.shape===`round`,"small-round":this.shape===`small-round`,square:this.shape===`no-round`},c=this.icon?n`<i class="leading-icon" part="leading-icon"
-					><moni-icon name="${this.icon}"></moni-icon
-				></i>`:t,l=this.loading?n`<i class="trailing-icon" part="trailing-icon"
-					><moni-progress
-						variant="circular"
-						indeterminate
-						size="small"
-						style="inline-size: 1.25rem; block-size: 1.25rem; color: currentColor;"
-					></moni-progress
-				></i>`:n`<i class="trailing-icon" part="trailing-icon" @click=${this._toggleDropdown}
-					><moni-icon name="${this.trailingIcon}"></moni-icon
-				></i>`,u=this._parsedOptions.some(e=>e.type===`group`)&&!this._searchQuery&&!this._useInlineCategories,d={"dropdown-menu":!0,open:this._open,scrollable:!u,searching:!!this._searchQuery,"inline-categories":this._useInlineCategories,"placement-top":this._actualPlacement===`top`,"placement-bottom":this._actualPlacement===`bottom`,"placement-left":this._actualPlacement===`left`,"placement-right":this._actualPlacement===`right`};return n`<div class=${p(s)} part="field">
-			${c}
-			<input
-				id="input"
-				type="text"
-				part="input"
-				.value=${a}
-				?readonly=${!this.searchable||this.sheet}
-				?disabled=${this.disabled}
-				inputmode=${f(!this.searchable||this.sheet?`none`:void 0)}
-				placeholder=${this.placeholder||``}
-				class=${o?`active`:``}
-				@click=${this._onInputClick}
-				@input=${this._onSearchInput}
-				@keydown=${this._onKeyDown}
-			/>
-			${this.label?n`<label
-						for="input"
-						part="label"
-						class=${p({active:o})}
-						>${this.label}</label
-					>`:t}
-			${l}
-			
-			${this.sheet?n`
-					<div class="sheet-backdrop ${this._open?`open`:``}" @click=${this._closeDropdown}>
-						<div class="sheet-drawer ${this._open?`open`:``}" @click=${e=>e.stopPropagation()}>
-							<div class="sheet-handle"></div>
-							${this.label?n`<div class="sheet-title">${this.label}</div>`:t}
-							${this.searchable?n`
-									<div class="sheet-search-wrapper">
-										<input
-											type="text"
-											class="sheet-search-input"
-											.value=${this._searchQuery}
-											placeholder="Buscar..."
-											@input=${this._onSearchInput}
-										/>
-									</div>
-								`:t}
-							<ul class="sheet-options-list">
-								${this._renderOptionsList(r)}
-							</ul>
-						</div>
-					</div>
-				`:n`
-					<ul
-						class=${p(d)}
-						part="menu"
-						popover=${this.positioning===`body`?`manual`:t}
-						style=${this._getMenuStyle()}
-					>
-						${this._renderOptionsList(r)}
-					</ul>
-				`}
-
-			<slot style="display: none;" @slotchange=${this._onSlotChange}></slot>
-
-			${this.error?n`<output part="helper" class="invalid"
-						>${this.errorText||this.helper}</output
-					>`:this.helper?n`<output part="helper">${this.helper}</output>`:t}
-		</div>`}};l([o({reflect:!0})],m.prototype,`name`,void 0),l([o({reflect:!0})],m.prototype,`label`,void 0),l([o({reflect:!0})],m.prototype,`variant`,void 0),l([o({reflect:!0})],m.prototype,`size`,void 0),l([o({reflect:!0})],m.prototype,`shape`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`disabled`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`required`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`loading`,void 0),l([o({reflect:!0})],m.prototype,`helper`,void 0),l([o({reflect:!0,attribute:`error-text`})],m.prototype,`errorText`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`error`,void 0),l([o({reflect:!0})],m.prototype,`value`,void 0),l([o({reflect:!0})],m.prototype,`icon`,void 0),l([o({reflect:!0,attribute:`trailing-icon`})],m.prototype,`trailingIcon`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`searchable`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`clearable`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`sheet`,void 0),l([o({reflect:!0})],m.prototype,`placeholder`,void 0),l([o({reflect:!0})],m.prototype,`positioning`,void 0),l([o({reflect:!0})],m.prototype,`placement`,void 0),l([o({reflect:!0,attribute:`dropdown-width`})],m.prototype,`dropdownWidth`,void 0),l([o({reflect:!0,attribute:`dropdown-max-height`})],m.prototype,`dropdownMaxHeight`,void 0),l([e()],m.prototype,`_open`,void 0),l([e()],m.prototype,`_searchQuery`,void 0),l([e()],m.prototype,`_actualPlacement`,void 0),l([e()],m.prototype,`_parsedOptions`,void 0),l([e()],m.prototype,`_activeIndex`,void 0),l([e()],m.prototype,`_menuStyle`,void 0),l([e()],m.prototype,`_menuMaxHeight`,void 0),l([e()],m.prototype,`_useInlineCategories`,void 0),l([e()],m.prototype,`_drilldownPath`,void 0),l([u(`slot`)],m.prototype,`_slot`,void 0),l([u(`input`)],m.prototype,`_input`,void 0),l([u(`.dropdown-menu`)],m.prototype,`_menu`,void 0),m=l([c(`moni-select`)],m);
+          <li
+            class="option-item ${i?`selected`:``} ${a?`active-nav`:``} ${t.disabled?`disabled`:``}"
+            @click=${()=>this._selectOption(t)}
+          >
+            ${t.label}
+          </li>
+        `}return n`
+        <li
+          class="group-header"
+          @click=${e=>{e.stopPropagation(),this._drilldownPath=[...this._drilldownPath,t]}}
+        >
+          <span>${t.label}</span>
+          <moni-icon
+            name="chevron_right"
+            style="margin-inline-start: auto; font-size: 1.125rem;"
+          ></moni-icon>
+        </li>
+      `})}_renderSubcategoryList(){if(this._drilldownPath.length===0)return t;let e=this._drilldownPath[this._drilldownPath.length-1],r=0;return n`
+      <li
+        class="group-header"
+        @click=${e=>{e.stopPropagation(),this._drilldownPath=this._drilldownPath.slice(0,-1)}}
+      >
+        <moni-icon
+          name="arrow_back"
+          style="font-size: 1.25rem; margin-inline-end: 8px;"
+        ></moni-icon>
+        <span>Regresar</span>
+      </li>
+      <li class="group-header-flat">${e.label}</li>
+      ${e.children.map(e=>{if(e.type===`option`){let t=r++,i=e.value===this.value,a=this._drilldownPath.length>0&&t===this._activeIndex;return n`
+            <li
+              class="option-item ${i?`selected`:``} ${a?`active-nav`:``} ${e.disabled?`disabled`:``}"
+              @click=${()=>this._selectOption(e)}
+            >
+              ${e.label}
+            </li>
+          `}return n`
+          <li
+            class="group-header"
+            @click=${t=>{t.stopPropagation(),this._drilldownPath=[...this._drilldownPath,e]}}
+          >
+            <span>${e.label}</span>
+            <moni-icon
+              name="chevron_right"
+              style="margin-inline-start: auto; font-size: 1.125rem;"
+            ></moni-icon>
+          </li>
+        `})}
+    `}_renderDesktopNode(e,t){if(e.type===`option`){let r=t.value++,i=e.value===this.value,a=r===this._activeIndex;return n`
+        <li
+          class="option-item ${i?`selected`:``} ${a?`active-nav`:``} ${e.disabled?`disabled`:``}"
+          @click=${()=>this._selectOption(e)}
+        >
+          ${e.label}
+        </li>
+      `}return n`
+      <li
+        class="group-header"
+        @mouseenter=${this._onSubmenuMouseEnter}
+        @click=${e=>e.stopPropagation()}
+      >
+        <span>${e.label}</span>
+        <moni-icon
+          name="chevron_right"
+          style="margin-inline-start: auto; font-size: 1.125rem;"
+        ></moni-icon>
+
+        <ul class="submenu active open-right">
+          ${e.children.map(e=>this._renderDesktopNode(e,t))}
+        </ul>
+      </li>
+    `}_renderOptionsList(e){if(this._parsedOptions.length===0)return n`<li class="no-options">No options found</li>`;if(this._searchQuery){let r={};e.forEach(e=>{let t=e.group||``;r[t]||(r[t]=[]),r[t].push(e)});let i=0;return Object.entries(r).map(([e,r])=>n`
+          ${e?n`<li class="group-header-flat">${e}</li>`:t}
+          ${r.map(e=>{let t=i++,r=e.value===this.value,a=t===this._activeIndex;return n`
+              <li
+                class="option-item ${r?`selected`:``} ${a?`active-nav`:``} ${e.disabled?`disabled`:``}"
+                @click=${()=>this._selectOption(e)}
+              >
+                ${e.label}
+              </li>
+            `})}
+        `)}if(this.sheet||this._useInlineCategories){let e=this._drilldownPath.length===0,t=!e;return n`
+        <div class="drilldown-wrapper">
+          <div
+            class="drilldown-track ${this._drilldownPath.length>0?`slide-active`:``}"
+          >
+            <ul
+              class="drilldown-panel ${e?`panel-active`:`panel-inactive`}"
+            >
+              ${this._renderRootList()}
+            </ul>
+            <ul
+              class="drilldown-panel ${t?`panel-active`:`panel-inactive`}"
+            >
+              ${this._renderSubcategoryList()}
+            </ul>
+          </div>
+        </div>
+      `}let r={value:0};return this._parsedOptions.map(e=>this._renderDesktopNode(e,r))}render(){let e=!!this.icon,r=this._getFilteredOptions(),i=this._findOptionByValue(this.value),a=this._open&&this.searchable&&!this.sheet?this._searchQuery:i?i.label:``,o=!!(a||this.placeholder),s={field:!0,label:!!this.label,fill:this.variant===`filled`,border:this.variant===`outlined`,small:this.size===`small`,large:this.size===`large`,extra:this.size===`extra`,prefix:e,suffix:!0,invalid:this.error,round:this.shape===`round`,"small-round":this.shape===`small-round`,square:this.shape===`no-round`},c=this.icon?n`<i class="leading-icon" part="leading-icon"
+          ><moni-icon name="${this.icon}"></moni-icon
+        ></i>`:t,l=this.loading?n`<i class="trailing-icon" part="trailing-icon"
+          ><moni-progress
+            variant="circular"
+            indeterminate
+            size="small"
+            style="inline-size: 1.25rem; block-size: 1.25rem; color: currentColor;"
+          ></moni-progress
+        ></i>`:n`<i
+          class="trailing-icon"
+          part="trailing-icon"
+          @click=${this._toggleDropdown}
+          ><moni-icon name="${this.trailingIcon}"></moni-icon
+        ></i>`,u=this._parsedOptions.some(e=>e.type===`group`)&&!this._searchQuery&&!this._useInlineCategories,d={"dropdown-menu":!0,open:this._open,scrollable:!u,searching:!!this._searchQuery,"inline-categories":this._useInlineCategories,"placement-top":this._actualPlacement===`top`,"placement-bottom":this._actualPlacement===`bottom`,"placement-left":this._actualPlacement===`left`,"placement-right":this._actualPlacement===`right`};return n`<div class=${p(s)} part="field">
+      ${c}
+      <input
+        id="input"
+        type="text"
+        part="input"
+        .value=${a}
+        ?readonly=${!this.searchable||this.sheet}
+        ?disabled=${this.disabled}
+        inputmode=${f(!this.searchable||this.sheet?`none`:void 0)}
+        placeholder=${this.placeholder||``}
+        class=${o?`active`:``}
+        @click=${this._onInputClick}
+        @input=${this._onSearchInput}
+        @keydown=${this._onKeyDown}
+      />
+      ${this.label?n`<label
+              for="input"
+              part="label"
+              class=${p({active:o})}
+              >${this.label}</label
+            >`:t}
+      ${l}
+      ${this.sheet?n`
+              <div
+                class="sheet-backdrop ${this._open?`open`:``}"
+                @click=${this._closeDropdown}
+              >
+                <div
+                  class="sheet-drawer ${this._open?`open`:``}"
+                  @click=${e=>e.stopPropagation()}
+                >
+                  <div class="sheet-handle"></div>
+                  ${this.label?n`<div class="sheet-title">${this.label}</div>`:t}
+                  ${this.searchable?n`
+                          <div class="sheet-search-wrapper">
+                            <input
+                              type="text"
+                              class="sheet-search-input"
+                              .value=${this._searchQuery}
+                              placeholder="Buscar..."
+                              @input=${this._onSearchInput}
+                            />
+                          </div>
+                        `:t}
+                  <ul class="sheet-options-list">
+                    ${this._renderOptionsList(r)}
+                  </ul>
+                </div>
+              </div>
+            `:n`
+              <ul
+                class=${p(d)}
+                part="menu"
+                popover=${this.positioning===`body`?`manual`:t}
+                style=${this._getMenuStyle()}
+              >
+                ${this._renderOptionsList(r)}
+              </ul>
+            `}
+
+      <slot style="display: none;" @slotchange=${this._onSlotChange}></slot>
+
+      ${this.error?n`<output part="helper" class="invalid"
+              >${this.errorText||this.helper}</output
+            >`:this.helper?n`<output part="helper">${this.helper}</output>`:t}
+    </div>`}};l([o({reflect:!0})],m.prototype,`name`,void 0),l([o({reflect:!0})],m.prototype,`label`,void 0),l([o({reflect:!0})],m.prototype,`variant`,void 0),l([o({reflect:!0})],m.prototype,`size`,void 0),l([o({reflect:!0})],m.prototype,`shape`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`disabled`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`required`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`loading`,void 0),l([o({reflect:!0})],m.prototype,`helper`,void 0),l([o({reflect:!0,attribute:`error-text`})],m.prototype,`errorText`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`error`,void 0),l([o({reflect:!0})],m.prototype,`value`,void 0),l([o({reflect:!0})],m.prototype,`icon`,void 0),l([o({reflect:!0,attribute:`trailing-icon`})],m.prototype,`trailingIcon`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`searchable`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`clearable`,void 0),l([o({type:Boolean,reflect:!0})],m.prototype,`sheet`,void 0),l([o({reflect:!0})],m.prototype,`placeholder`,void 0),l([o({reflect:!0})],m.prototype,`positioning`,void 0),l([o({reflect:!0})],m.prototype,`placement`,void 0),l([o({reflect:!0,attribute:`dropdown-width`})],m.prototype,`dropdownWidth`,void 0),l([o({reflect:!0,attribute:`dropdown-max-height`})],m.prototype,`dropdownMaxHeight`,void 0),l([e()],m.prototype,`_open`,void 0),l([e()],m.prototype,`_searchQuery`,void 0),l([e()],m.prototype,`_actualPlacement`,void 0),l([e()],m.prototype,`_parsedOptions`,void 0),l([e()],m.prototype,`_activeIndex`,void 0),l([e()],m.prototype,`_menuStyle`,void 0),l([e()],m.prototype,`_menuMaxHeight`,void 0),l([e()],m.prototype,`_useInlineCategories`,void 0),l([e()],m.prototype,`_drilldownPath`,void 0),l([u(`slot`)],m.prototype,`_slot`,void 0),l([u(`input`)],m.prototype,`_input`,void 0),l([u(`.dropdown-menu`)],m.prototype,`_menu`,void 0),m=l([c(`moni-select`)],m);