// @bun
var{defineProperty:s,getOwnPropertyNames:x,getOwnPropertyDescriptor:f}=Object,g=Object.prototype.hasOwnProperty;function h(e){return this[e]}var w=(e)=>{var t=(n??=new WeakMap).get(e),a;if(t)return t;if(t=s({},"__esModule",{value:!0}),e&&typeof e==="object"||typeof e==="function"){for(var o of x(e))if(!g.call(t,o))s(t,o,{get:h.bind(e,o),enumerable:!(a=f(e,o))||a.enumerable})}return n.set(e,t),t},n;var b=(e)=>e;function v(e,t){this[e]=b.bind(null,t)}var M=(e,t)=>{for(var a in t)s(e,a,{get:t[a],enumerable:!0,configurable:!0,set:v.bind(t,a)})};var y=(e,t)=>()=>(e&&(t=e(e=0)),t);var B=import.meta.require;function d(e){return e.replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/'/g,"&#39;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function r(e,t){if(e.serverDynamic[t]!==void 0)return String(e.serverDynamic[t]);let a=e.static[t];if(typeof a==="string")return a;return}var l,E;var S=y(()=>{l={sm:"max-width:24rem",md:"max-width:32rem",lg:"max-width:42rem",xl:"max-width:56rem",full:"max-width:calc(100vw - 2rem);max-height:calc(100vh - 2rem)"},E={name:"StxModal",aliases:["stx-modal"],render(e,t,a){let o=r(e,"id");if(!o)return console.warn('[stx] <StxModal> requires an "id" prop'),"<!-- StxModal: missing id prop -->";let i=d(o),c=r(e,"size")||"md",m=r(e,"closeOnBackdrop")!=="false",p=r(e,"closeOnEscape")!=="false",u=l[c]||l.md;return`<div id="stx-modal-${i}" class="stx-modal-backdrop" data-stx-modal="${i}" data-close-backdrop="${m}" data-close-escape="${p}" style="display:none;position:fixed;inset:0;z-index:99999;align-items:center;justify-content:center;background:rgba(0,0,0,0.5);backdrop-filter:blur(2px);opacity:0;transition:opacity 0.2s ease" aria-modal="true" role="dialog">
  <div class="stx-modal-panel" style="${u};width:100%;margin:1rem;border-radius:0.75rem;box-shadow:0 20px 60px rgba(0,0,0,0.3);overflow:hidden;transform:scale(0.95) translateY(8px);transition:transform 0.2s ease,opacity 0.2s ease;opacity:0;background:var(--stx-modal-bg,#fff);color:var(--stx-modal-text,#1f2937)">
    <div style="padding:1.5rem">${t}</div>
  </div>
</div>
<style>
@media(prefers-color-scheme:dark){[data-stx-modal]{--stx-modal-bg:#1f2937;--stx-modal-text:#f3f4f6}}
.stx-modal-backdrop[data-stx-modal-open]{display:flex!important;opacity:1}
.stx-modal-backdrop[data-stx-modal-open] .stx-modal-panel{transform:scale(1) translateY(0);opacity:1}
</style>`}}});S();export{E as StxModalBuiltin};
