@infinityfx/fluid/dist/components/display/action-menu/item.js

React UI library, using zero-runtime CSS-in-JS.

"use client";
import{jsx as e}from"react/jsx-runtime";import r from"../../feedback/halo.js";import{createStyles as o}from"../../../core/style.js";import{combineClasses as t,classes as n,combineRefs as l,filterFocusable as a}from"../../../core/utils.js";import{usePopover as i}from"../../layout/popover/root.js";import{useRef as c}from"react";const m=o("action-menu.item",{".item":{position:"relative",padding:".5rem .8rem",border:"none",background:"none",outline:"none",width:"100%",borderRadius:"var(--f-radius-sml)",userSelect:"none",display:"flex",alignItems:"center",gap:"var(--f-spacing-xsm)",color:"var(--color, var(--f-clr-text-100))",lineHeight:1.25,WebkitTapHighlightColor:"transparent","--halo-color":"color-mix(in srgb, var(--color, var(--f-clr-primary-100)) 50%, var(--f-clr-text-200))"},".item:enabled":{cursor:"pointer"},".item:disabled":{color:"var(--f-clr-grey-500)"}});function s({children:o,cc:s={},keepOpen:p,className:u,color:f,...d}){const y=t(m,s),h=c(null),g=i();return e(r,{disabled:d.disabled,color:"var(--halo-color)",children:e("button",{...d,ref:l(d.ref,h),type:"button",role:"menuitem",style:{...d.style,"--color":f},className:n(y.item,u),onClick:e=>{d.onClick?.(e),p||g.toggle(!1)},onKeyDown:e=>{d.onKeyDown?.(e);let r=h.current?.parentElement;for(;r&&!r.matches('[role="menu"], [role="group"]');)r=r.parentElement;if(r?.matches('[role="menu"]')&&("ArrowRight"===e.key||"ArrowLeft"===e.key)){const o=r.parentElement?.querySelector('[aria-haspopup="menu"]');o&&(e.preventDefault(),o.focus())}const o="ArrowDown"===e.key?1:"ArrowUp"===e.key?-1:0;if(r&&0!==o){const t=a(Array.from(r.children)),n=t.findIndex((e=>e===h.current)),l=t[n+o];l&&l.focus(),n>=0&&e.preventDefault()}},children:o})})}s.displayName="ActionMenu.Item";export{s as default};
//# sourceMappingURL=item.js.map