UNPKG

@styleless-ui/react

Version:

Completely unstyled, headless and accessible React UI components.

1 lines 2.24 kB
var e=this&&this.__assign||function(){return e=Object.assign||function(e){for(var o,t=1,r=arguments.length;t<r;t++)for(var n in o=arguments[t])Object.prototype.hasOwnProperty.call(o,n)&&(e[n]=o[n]);return e},e.apply(this,arguments)},o=this&&this.__rest||function(e,o){var t={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&o.indexOf(r)<0&&(t[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(r=Object.getOwnPropertySymbols(e);n<r.length;n++)o.indexOf(r[n])<0&&Object.prototype.propertyIsEnumerable.call(e,r[n])&&(t[r[n]]=e[r[n]])}return t};import{jsx as t,jsxs as r}from"react/jsx-runtime";import*as n from"react";import l from"../Portal";import{componentWithForwardedRef as i,useDeterministicId as a,useIsMounted as s,useOnChange as c,usePreviousValue as u,useScrollGuard as f}from"../utils";import d from"./context";import{Backdrop as p,Root as m}from"./slots";var v=i((function(i,v){var y=i.open,b=i.children,h=i.id,O=i.role,g=i.keepMounted,j=void 0!==g&&g,k=i.focusAfterClosed,P=i.classes,x=i.onBackdropClick,S=o(i,["open","children","id","role","keepMounted","focusAfterClosed","classes","onBackdropClick"]),_=s(),C=a(h,"styleless-ui__dialog"),w=n.useRef(null),E=u(y),B=f(),M=B.disablePageScroll,R=B.enablePageScroll;n.useEffect((function(){var e,o;y||"boolean"!=typeof E||y===E||("string"==typeof k?null===(e=document.querySelector(k))||void 0===e||e.focus():"object"==typeof k?null===(o=k.current)||void 0===o||o.focus():w.current?w.current.focus():document.body.focus())}),[y,E]),n.useEffect((function(){return function(){return R()}}),[]),c(y,(function(e){_()&&(w.current=document.activeElement,"boolean"==typeof E&&(e?M():R()))}));var A="function"==typeof P?P({openState:y}):P,I=n.useMemo((function(){return{open:y,role:O}}),[O,y]);return j||!j&&y?t(l,{children:t("div",e({"data-slot":"Portal:Root",role:"presentation",tabIndex:-1,"aria-hidden":!y,style:{position:"absolute",top:0,left:0,right:0}},{children:r("div",e({},S,{id:C,ref:v,className:null==A?void 0:A.root,"data-slot":m,"data-open":y?"":void 0},{children:[t("div",{"aria-hidden":"true","data-slot":p,className:null==A?void 0:A.backdrop,onClick:x}),t(d.Provider,e({value:I},{children:b}))]}))}))}):null}));export default v;