6 lines
3.1 KiB
JavaScript
6 lines
3.1 KiB
JavaScript
import{j as t}from"./jsx-runtime-D_zvdyIk.js";import{r as n}from"./index-JhL3uwfD.js";import{c as v}from"./cn-CDN07tui.js";import"./index-BKyvj4H5.js";import{F as w}from"./XMarkIcon-Bsb1W5VN.js";const j={md:"max-w-lg",lg:"max-w-3xl"};function k({isOpen:i,onClose:o,title:b,description:l,children:h,size:y="lg"}){const u=n.useId(),m=n.useId(),d=n.useRef(null),f=n.useRef(null);return n.useEffect(()=>{if(!i)return;f.current=document.activeElement;const r=window.setTimeout(()=>{var e;(e=d.current)==null||e.focus()},0),p=e=>{var x;if(e.key==="Escape"&&(e.preventDefault(),o()),e.key==="Tab"){const c=(x=d.current)==null?void 0:x.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(!c||c.length===0){e.preventDefault();return}const g=[...c],s=g[0],a=g.at(-1);!e.shiftKey&&document.activeElement===a&&(e.preventDefault(),s==null||s.focus()),e.shiftKey&&document.activeElement===s&&(e.preventDefault(),a==null||a.focus())}};return document.addEventListener("keydown",p),()=>{var e;clearTimeout(r),document.removeEventListener("keydown",p),(e=f.current)==null||e.focus()}},[i,o]),i?t.jsxs("div",{className:"fixed inset-0 z-50 flex items-center justify-center p-4",role:"presentation",onClick:r=>{r.target===r.currentTarget&&o()},children:[t.jsx("div",{className:"absolute inset-0 bg-background/80 backdrop-blur-sm","aria-hidden":"true"}),t.jsxs("div",{ref:d,role:"dialog","aria-modal":"true","aria-labelledby":u,"aria-describedby":l?m:void 0,tabIndex:-1,className:v("relative z-10 w-full rounded-2xl border border-border bg-card text-card-foreground shadow-[var(--cp-shadow-3)] max-h-[90vh] overflow-y-auto outline-none",j[y]),onClick:r=>r.stopPropagation(),children:[t.jsxs("div",{className:"sticky top-0 z-10 flex items-start justify-between gap-4 border-b border-border bg-card px-6 py-4",children:[t.jsxs("div",{className:"min-w-0",children:[t.jsx("h2",{id:u,className:"text-lg font-semibold text-foreground",children:b}),l?t.jsx("p",{id:m,className:"mt-1 text-sm text-muted-foreground",children:l}):null]}),t.jsx("button",{onClick:o,className:"text-muted-foreground transition-colors hover:text-foreground flex-shrink-0","aria-label":"Close modal",type:"button",children:t.jsx(w,{className:"h-5 w-5"})})]}),t.jsx("div",{className:"p-6",children:h})]})]}):null}k.__docgenInfo={description:`Lightweight modal shell (overlay + card) used by the Internet shop experience.
|
|
Implements:
|
|
- Backdrop click to close
|
|
- Escape to close
|
|
- Simple focus trap + focus restore (pattern aligned with SessionTimeoutWarning)`,methods:[],displayName:"InternetModalShell",props:{isOpen:{required:!0,tsType:{name:"boolean"},description:""},onClose:{required:!0,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},title:{required:!0,tsType:{name:"string"},description:""},description:{required:!1,tsType:{name:"string"},description:""},children:{required:!0,tsType:{name:"ReactReactNode",raw:"React.ReactNode"},description:""},size:{required:!1,tsType:{name:"union",raw:'"md" | "lg"',elements:[{name:"literal",value:'"md"'},{name:"literal",value:'"lg"'}]},description:"",defaultValue:{value:'"lg"',computed:!1}}}};export{k as I};
|