https://luxen-ui.com/assets/chunks/index.BoQbuGVI.js

1import{L as S,t as y,b as m,A as i,r as C,d as P}from"./luxen-element.Drtn2aqF.js";import{n as c}from"./property.uC1zJY6n.js";import{r as E}from"./state.D05NpoBx.js";import{P as O}from"./popover.Dj1-b3c_.js";import{h as D}from"./host.styles.RxOa3n5i.js";import"./floating-ui.dom.Bilqx-v2.js";const F=`:host{display:block}:host([disabled]){pointer-events:none;opacity:.5}.item{display:flex;align-items:center;gap:8px;box-sizing:border-box;min-block-size:36px;padding:.375rem .5rem;cursor:pointer;outline:none;border-radius:4px;font-size:.875rem;line-height:1.5;color:var(--l-color-text-primary);white-space:nowrap;text-align:start}.item:focus-visible{background:var(--l-color-bg-state-hover);outline:2px solid var(--l-focus-ring);outline-offset:-2px}@media(hover:hover){.item:hover{background:var(--l-color-bg-state-hover)}}:host([submenu-open]) .item{background:var(--l-color-bg-state-hover)}:host([variant="destructive"]) .item{color:var(--l-color-text-danger)}:host([variant="destructive"]) .item:focus-visible{background:var(--l-color-bg-fill-danger-soft);outline-color:var(--l-color-text-danger)}@media(hover:hover){:host([variant="destructive"]) .item:hover{background:var(--l-color-bg-fill-danger-soft)}}.check{display:flex;width:16px;flex-shrink:0}.submenu-indicator{inline-size:16px;block-size:16px;flex-shrink:0;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain}:host(:dir(rtl)) .submenu-indicator{scale:-1 1}.submenu{inset:unset;overflow:visible;box-sizing:border-box;width:max-content;padding:var(--padding, .25rem);margin:0;border:1px solid var(--l-color-border-overlay);border-radius:var(--border-radius, 6px);background:var(--background, var(--l-color-surface-overlay));color:var(--l-color-text-primary);box-shadow:var(--shadow, 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -2px rgb(0 0 0 / 6%));font-size:.875rem;line-height:1.5}slot[name=submenu]::slotted(hr){display:block;height:1px;margin-block:var(--padding, .25rem);margin-inline:calc(var(--padding, .25rem) * -1);border:0;background:var(--l-color-divider)}:host(:not([checked])) .check svg{visibility:hidden}::slotted([slot="prefix"]),::slotted([slot="suffix"]){display:flex;flex-shrink:0}.label{flex:1}`;var h=function(s,e,t,o){var n=arguments.length,a=n<3?e:o===null?o=Object.getOwnPropertyDescriptor(e,t):o,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")a=Reflect.decorate(s,e,t,o);else for(var x=s.length-1;x>=0;x--)(d=s[x])&&(a=(n<3?d(a):n>3?d(e,t,a):d(e,t))||a);return n>3&&a&&Object.defineProperty(e,t,a),a},l=function(s,e,t,o){if(t==="a"&&!o)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?s!==e||!o:!e.has(s))throw new TypeError("Cannot read private member from an object whose class did not declare it");return t==="m"?o:t==="a"?o.call(s):o?o.value:e.get(s)},u=function(s,e,t,o,n){if(o==="m")throw new TypeError("Private method is not writable");if(o==="a"&&!n)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?s!==e||!n:!e.has(s))throw new TypeError("Cannot write private member to an object whose class did not declare it");return o==="a"?n.call(s,t):n?n.value=t:e.set(s,t),t},p,b,g,f,v,w,_,k;const M=C(F);class r extends S{constructor(){super(...arguments),this._submenuFloating=new O(this,{getTriggerElement:()=>this,getFloatingElement:()=>this._submenuEl,getArrowElement:()=>null}),p.set(this,""),b.set(this,!1),g.set(this,"normal"),f.set(this,void 0),v.set(this,!1),w.set(this,!1),_.set(this,"start"),k.set(this,!1),this._onSubmenuSlotChange=e=>{const t=e.target;this._hasSubmenu=t.assignedElements().some(o=>o.tagName===y("dropdown-item").toUpperCase())}}get value(){return l(this,p,"f")}set value(e){u(this,p,e,"f")}get disabled(){return l(this,b,"f")}set disabled(e){u(this,b,e,"f")}get type(){return l(this,g,"f")}set type(e){u(this,g,e,"f")}get variant(){return l(this,f,"f")}

1set variant(e){u(this,f,e,"f")}get checked(){return l(this,v,"f")}set checked(e){u(this,v,e,"f")}get submenuOpen(){return l(this,w,"f")}set submenuOpen(e){u(this,w,e,"f")}get checkPlacement(){return l(this,_,"f")}set checkPlacement(e){u(this,_,e,"f")}get _hasSubmenu(){return l(this,k,"f")}set _hasSubmenu(e){u(this,k,e,"f")}get hasSubmenu(){return this._hasSubmenu}connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","none")}get _submenuEl(){return this.shadowRoot.querySelector(".submenu")}getTextLabel(){const e=this.shadowRoot?.querySelector("slot:not([name])");return e?e.assignedNodes({flatten:!0}).map(t=>t.textContent??"").join("").trim():(this.textContent??"").trim()}getSubmenuItems(){const e=this.shadowRoot?.querySelector('slot[name="submenu"]');return e?e.assignedElements().filter(t=>t.tagName===y("dropdown-item").toUpperCase()&&!t.disabled):[]}openSubmenu(){!this._hasSubmenu||this.disabled||this.submenuOpen||(this.submenuOpen=!0)}closeSubmenu(){for(const e of this.getSubmenuItems())e.closeSubmenu();this.submenuOpen&&(this.submenuOpen=!1)}updated(e){e.has("submenuOpen")&&this._handleSubmenuOpenChange()}_getDuration(e){const t=parseFloat(getComputedStyle(this).getPropertyValue(e));return Number.isNaN(t)?150:t}async _handleSubmenuOpenChange(){const e=this._submenuEl;if(!e)return;const o={placement:getComputedStyle(this).direction==="rtl"?"left-start":"right-start",distance:0,skidding:-parseFloat(getComputedStyle(e).paddingTop||"0")};if(this.submenuOpen){if(!this.isConnected||(e.showPopover(),await this._submenuFloating.updatePosition(o),!this.submenuOpen))return;await this._submenuFloating.animateShow(e,this._getDuration("--show-duration")),this._submenuFloating.startPositioning(o)}else{if(!e.matches(":popover-open"))return;this._submenuFloating.stopPositioning(),await this._submenuFloating.animateHide(e,this._getDuration("--hide-duration")),e.matches(":popover-open")&&e.hidePopover()}}_renderCheck(){return m`
2      <span
3        class="check"
4        aria-hidden="true"
5      >
6        <svg
7          width="16"
8          height="16"

9          viewBox="0 0 16 16"
10          fill="none"
11        >
12          <path
13            d="M3.5 8.5L6.5 11.5L12.5 4.5"
14            stroke="currentColor"
15            stroke-width="1.5"
16            stroke-linecap="round"
17            stroke-linejoin="round"
18          />
19        </svg>
20      </span>
21    `}render(){const e=this.type==="checkbox",t=e&&this.checkPlacement==="start";return m`
22      <div
23        class="item"
24        role=${e?"menuitemcheckbox":"menuitem"}
25        aria-checked=${e?String(this.checked):i}
26        aria-disabled=${this.disabled?"true":i}
27        aria-haspopup=${this._hasSubmenu?"menu":i}
28        aria-expanded=${this._hasSubmenu?String(this.submenuOpen):i}
29        aria-controls=${this._hasSubmenu?"submenu":i}
30        tabindex="-1"
31      >
32        <!-- The check owns the leading column by default, which is why a
33             checkbox item has no room for a prefix there. Moving it to the
34             trailing edge frees that column, so an item can carry its own icon
35             and still show whether it is on — a theme row with a sun/moon, a
36             Show-grid row with a grid glyph. The aria-checked above is what
37             assistive tech reads, and it is unaffected by where the mark sits.
38             (No backticks in this comment: it lives inside a template literal.) -->
39        ${t?this._renderCheck():i}
40        ${t?i:m`<slot name="prefix"></slot>`}
41        <span
42          class="label"
43          id="label"
44          ><slot></slot
45        ></span>
46        <slot name="suffix"></slot>
47        ${e&&this.checkPlacement==="end"?this._renderCheck():i}
48        ${this._hasSubmenu?m`<span
49              class="submenu-indicator"
50              aria-hidden="true"
51            ></span>`:i}
52      </div>
53      <div
54        class="submenu"
55        part="submenu"
56        id="submenu"
57        popover="manual"
58        role="menu"
59        aria-labelledby="label"
60      >
61        <slot
62          name="submenu"
63          @slotchange=${this._onSubmenuSlotChange}
64        ></slot>
65      </div>
66    `}}p=new WeakMap,b=new WeakMap,g=new WeakMap,f=new WeakMap,v=new WeakMap,w=new WeakMap,_=new WeakMap,k=new WeakMap;r.styles=[D,M];h([c()],r.prototype,"value",null);h([c({type:Boolean,reflect:!0})],r.prototype,"disabled",null);h([c()],r.prototype,"type",null);h([c({reflect:!0})],r.prototype,"variant",null);h([c({type:Boolean,reflect:!0})],r.prototype,"checked",null);h([c({type:Boolean,reflect:!0,attribute:"submenu-open"})],r.prototype,"submenuOpen",null);h([c({reflect:!0,attribute:"check-placement"})],r.prototype,"checkPlacement",null);h([E()],r.prototype,"_hasSubmenu",null);P("dropdown-item",r);export{r as DropdownItem};