UNPKG

@anoki/fse-ui

Version:

FSE UI components library

3 lines (2 loc) 4.45 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const H=require("react"),m=require("./index.cjs470.js"),B=require("./index.cjs482.js"),Y=require("./index.cjs471.js"),z=require("./index.cjs472.js"),V=require("./index.cjs476.js"),D=require("./index.cjs474.js"),J=require("./index.cjs480.js"),Q=require("./index.cjs473.js"),W=require("./index.cjs483.js"),f=require("./index.cjs244.js");function X(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const c=X(H);var _="rovingFocusGroup.onEntryFocus",Z={bubbles:!1,cancelable:!0},g="RovingFocusGroup",[j,G,ee]=B.createCollection(g),[te,oe]=z.createContextScope(g,[ee]),[re,ne]=te(g),A=c.forwardRef((e,o)=>f.jsxRuntimeExports.jsx(j.Provider,{scope:e.__scopeRovingFocusGroup,children:f.jsxRuntimeExports.jsx(j.Slot,{scope:e.__scopeRovingFocusGroup,children:f.jsxRuntimeExports.jsx(se,{...e,ref:o})})}));A.displayName=g;var se=c.forwardRef((e,o)=>{const{__scopeRovingFocusGroup:r,orientation:t,loop:R=!1,dir:I,currentTabStopId:x,defaultCurrentTabStopId:F,onCurrentTabStopIdChange:p,onEntryFocus:u,preventScrollOnEntryFocus:E=!1,...S}=e,v=c.useRef(null),b=Y.useComposedRefs(o,v),n=W.useDirection(I),[l=null,w]=Q.useControllableState({prop:x,defaultProp:F,onChange:p}),[i,a]=c.useState(!1),T=J.useCallbackRef(u),M=G(r),C=c.useRef(!1),[K,O]=c.useState(0);return c.useEffect(()=>{const s=v.current;if(s)return s.addEventListener(_,T),()=>s.removeEventListener(_,T)},[T]),f.jsxRuntimeExports.jsx(re,{scope:r,orientation:t,dir:n,loop:R,currentTabStopId:l,onItemFocus:c.useCallback(s=>w(s),[w]),onItemShiftTab:c.useCallback(()=>a(!0),[]),onFocusableItemAdd:c.useCallback(()=>O(s=>s+1),[]),onFocusableItemRemove:c.useCallback(()=>O(s=>s-1),[]),children:f.jsxRuntimeExports.jsx(D.Primitive.div,{tabIndex:i||K===0?-1:0,"data-orientation":t,...S,ref:b,style:{outline:"none",...e.style},onMouseDown:m.composeEventHandlers(e.onMouseDown,()=>{C.current=!0}),onFocus:m.composeEventHandlers(e.onFocus,s=>{const k=!C.current;if(s.target===s.currentTarget&&k&&!i){const P=new CustomEvent(_,Z);if(s.currentTarget.dispatchEvent(P),!P.defaultPrevented){const y=M().filter(d=>d.focusable),L=y.find(d=>d.active),U=y.find(d=>d.id===l),$=[L,U,...y].filter(Boolean).map(d=>d.ref.current);q($,E)}}C.current=!1}),onBlur:m.composeEventHandlers(e.onBlur,()=>a(!1))})})}),N="RovingFocusGroupItem",h=c.forwardRef((e,o)=>{const{__scopeRovingFocusGroup:r,focusable:t=!0,active:R=!1,tabStopId:I,...x}=e,F=V.useId(),p=I||F,u=ne(N,r),E=u.currentTabStopId===p,S=G(r),{onFocusableItemAdd:v,onFocusableItemRemove:b}=u;return c.useEffect(()=>{if(t)return v(),()=>b()},[t,v,b]),f.jsxRuntimeExports.jsx(j.ItemSlot,{scope:r,id:p,focusable:t,active:R,children:f.jsxRuntimeExports.jsx(D.Primitive.span,{tabIndex:E?0:-1,"data-orientation":u.orientation,...x,ref:o,onMouseDown:m.composeEventHandlers(e.onMouseDown,n=>{t?u.onItemFocus(p):n.preventDefault()}),onFocus:m.composeEventHandlers(e.onFocus,()=>u.onItemFocus(p)),onKeyDown:m.composeEventHandlers(e.onKeyDown,n=>{if(n.key==="Tab"&&n.shiftKey){u.onItemShiftTab();return}if(n.target!==n.currentTarget)return;const l=ie(n,u.orientation,u.dir);if(l!==void 0){if(n.metaKey||n.ctrlKey||n.altKey||n.shiftKey)return;n.preventDefault();let i=S().filter(a=>a.focusable).map(a=>a.ref.current);if(l==="last")i.reverse();else if(l==="prev"||l==="next"){l==="prev"&&i.reverse();const a=i.indexOf(n.currentTarget);i=u.loop?ae(i,a+1):i.slice(a+1)}setTimeout(()=>q(i))}})})})});h.displayName=N;var ce={ArrowLeft:"prev",ArrowUp:"prev",ArrowRight:"next",ArrowDown:"next",PageUp:"first",Home:"first",PageDown:"last",End:"last"};function ue(e,o){return o!=="rtl"?e:e==="ArrowLeft"?"ArrowRight":e==="ArrowRight"?"ArrowLeft":e}function ie(e,o,r){const t=ue(e.key,r);if(!(o==="vertical"&&["ArrowLeft","ArrowRight"].includes(t))&&!(o==="horizontal"&&["ArrowUp","ArrowDown"].includes(t)))return ce[t]}function q(e,o=!1){const r=document.activeElement;for(const t of e)if(t===r||(t.focus({preventScroll:o}),document.activeElement!==r))return}function ae(e,o){return e.map((r,t)=>e[(o+t)%e.length])}var le=A,de=h;exports.Item=de;exports.Root=le;exports.RovingFocusGroup=A;exports.RovingFocusGroupItem=h;exports.createRovingFocusGroupScope=oe; //# sourceMappingURL=index.cjs490.js.map