@olonjs/react 0.1.1

package/dist/olonjs-react.umd.cjs

@@ -0,0 +1,57 @@
+(function(E,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("react"),require("react-router-dom"),require("@olonjs/core")):typeof define=="function"&&define.amd?define(["exports","react","react-router-dom","@olonjs/core"],i):(E=typeof globalThis<"u"?globalThis:E||self,i(E.OlonJsReact={},E.React,E.ReactRouterDOM,E.OlonJsCore))})(this,(function(E,i,k,p){"use strict";var q={exports:{}},G={};/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var me;function Re(){if(me)return G;me=1;var e=Symbol.for("react.transitional.element"),s=Symbol.for("react.fragment");function r(a,o,u){var f=null;if(u!==void 0&&(f=""+u),o.key!==void 0&&(f=""+o.key),"key"in o){u={};for(var C in o)C!=="key"&&(u[C]=o[C])}else u=o;return o=u.ref,{$$typeof:e,type:a,key:f,ref:o!==void 0?o:null,props:u}}return G.Fragment=s,G.jsx=r,G.jsxs=r,G}var X={};/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var fe;function Ne(){return fe||(fe=1,process.env.NODE_ENV!=="production"&&(function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===U?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case v:return"Fragment";case D:return"Profiler";case T:return"StrictMode";case R:return"Suspense";case I:return"SuspenseList";case F:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case x:return"Portal";case b:return t.displayName||"Context";case y:return(t._context.displayName||"Context")+".Consumer";case m:var d=t.render;return t=t.displayName,t||(t=d.displayName||d.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case N:return d=t.displayName||null,d!==null?d:e(t.type)||"Memo";case M:d=t._payload,t=t._init;try{return e(t(d))}catch{}}return null}function s(t){return""+t}function r(t){try{s(t);var d=!1}catch{d=!0}if(d){d=console;var w=d.error,P=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return w.call(d,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",P),s(t)}}function a(t){if(t===v)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===M)return"<...>";try{var d=e(t);return d?"<"+d+">":"<...>"}catch{return"<...>"}}function o(){var t=V.A;return t===null?null:t.getOwner()}function u(){return Error("react-stack-top-frame")}function f(t){if(Y.call(t,"key")){var d=Object.getOwnPropertyDescriptor(t,"key").get;if(d&&d.isReactWarning)return!1}return t.key!==void 0}function C(t,d){function w(){z||(z=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",d))}w.isReactWarning=!0,Object.defineProperty(t,"key",{get:w,configurable:!0})}function _(){var t=e(this.type);return L[t]||(L[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function S(t,d,w,P,ne,de){var O=w.ref;return t={$$typeof:c,type:t,key:d,props:w,_owner:P},(O!==void 0?O:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:_}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:ne}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:de}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function g(t,d,w,P,ne,de){var O=d.children;if(O!==void 0)if(P)if(B(O)){for(P=0;P<O.length;P++)j(O[P]);Object.freeze&&Object.freeze(O)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else j(O);if(Y.call(d,"key")){O=e(t);var W=Object.keys(d).filter(function(Ze){return Ze!=="key"});P=0<W.length?"{key: someKey, "+W.join(": ..., ")+": ...}":"{key: someKey}",K[O+P]||(W=0<W.length?"{"+W.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,P,O,W,O),K[O+P]=!0)}if(O=null,w!==void 0&&(r(w),O=""+w),f(d)&&(r(d.key),O=""+d.key),"key"in d){w={};for(var ue in d)ue!=="key"&&(w[ue]=d[ue])}else w=d;return O&&C(w,typeof t=="function"?t.displayName||t.name||"Unknown":t),S(t,O,w,o(),ne,de)}function j(t){h(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===M&&(t._payload.status==="fulfilled"?h(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function h(t){return typeof t=="object"&&t!==null&&t.$$typeof===c}var l=i,c=Symbol.for("react.transitional.element"),x=Symbol.for("react.portal"),v=Symbol.for("react.fragment"),T=Symbol.for("react.strict_mode"),D=Symbol.for("react.profiler"),y=Symbol.for("react.consumer"),b=Symbol.for("react.context"),m=Symbol.for("react.forward_ref"),R=Symbol.for("react.suspense"),I=Symbol.for("react.suspense_list"),N=Symbol.for("react.memo"),M=Symbol.for("react.lazy"),F=Symbol.for("react.activity"),U=Symbol.for("react.client.reference"),V=l.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,Y=Object.prototype.hasOwnProperty,B=Array.isArray,H=console.createTask?console.createTask:function(){return null};l={react_stack_bottom_frame:function(t){return t()}};var z,L={},A=l.react_stack_bottom_frame.bind(l,u)(),J=H(a(u)),K={};X.Fragment=v,X.jsx=function(t,d,w){var P=1e4>V.recentlyCreatedOwnerStacks++;return g(t,d,w,!1,P?Error("react-stack-top-frame"):A,P?H(a(t)):J)},X.jsxs=function(t,d,w){var P=1e4>V.recentlyCreatedOwnerStacks++;return g(t,d,w,!0,P?Error("react-stack-top-frame"):A,P?H(a(t)):J)}})()),X}var pe;function ke(){return pe||(pe=1,process.env.NODE_ENV==="production"?q.exports=Re():q.exports=Ne()),q.exports}var n=ke();class he extends i.Component{constructor(s){super(s),this.state={hasError:!1,error:null}}static getDerivedStateFromError(s){return{hasError:!0,error:s}}componentDidCatch(s,r){console.error("[JsonPages Engine]",s,r)}render(){return this.state.hasError&&this.state.error?n.jsxs("div",{style:{minHeight:"100vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",padding:24,backgroundColor:"#0f172a",color:"#e2e8f0",fontFamily:"ui-sans-serif, system-ui, sans-serif"},children:[n.jsx("h1",{style:{fontSize:"1.25rem",fontWeight:700,marginBottom:8},children:"JsonPages Engine Error"}),n.jsx("pre",{style:{maxWidth:"100%",overflow:"auto",padding:16,backgroundColor:"rgba(0,0,0,0.3)",borderRadius:8,fontSize:12,marginTop:8},children:this.state.error.message})]}):this.props.children}}const ge=()=>n.jsxs("div",{style:{"--local-bg":"var(--color-background)","--local-text":"var(--color-text)","--local-text-muted":"var(--color-text-muted)","--local-primary":"var(--color-primary)","--local-radius-md":"var(--radius-md)"},className:"min-h-screen flex flex-col items-center justify-center bg-[var(--local-bg)] px-6",children:[n.jsx("h1",{className:"text-6xl font-bold text-[var(--local-text)] mb-4",children:"404"}),n.jsx("p",{className:"text-xl text-[var(--local-text-muted)] mb-8",children:"Page not found"}),n.jsx(k.Link,{to:"/",className:"inline-flex items-center gap-2 px-6 py-3 rounded-[var(--local-radius-md)] bg-[var(--local-primary)] text-[var(--local-bg)] font-semibold text-sm hover:opacity-90 transition-opacity",children:"Back to Home"})]}),ve=i.createContext(void 0),be=({config:e,children:s})=>n.jsx(ve.Provider,{value:{registry:e.registry,schemas:e.schemas,tenantId:e.tenantId,basePath:e.basePath,assets:e.assets,overlayDisabledSectionTypes:e.overlayDisabledSectionTypes},children:s});function Ee(){const e=i.useContext(ve);if(e===void 0)throw new Error("useConfig must be used within ConfigProvider");return e}const se=new Set,$={setTheme:e=>{const s=document.documentElement,r=p.buildThemeVariableMap(e);se.forEach(a=>{s.style.removeProperty(a)}),se.clear(),Object.entries(r).forEach(([a,o])=>{s.style.setProperty(a,o),se.add(a)})}},oe=i.createContext({}),Pe=()=>i.useContext(oe);function ye(){return n.jsxs(n.Fragment,{children:[n.jsx(k.ScrollRestoration,{}),n.jsx(k.Outlet,{})]})}function Se({config:e,routesBuilder:s,adminCss:r=""}){var F,U,V,Y,B,H,z;const{registry:a={},schemas:o={},basePath:u="/",pages:f={},siteConfig:C,themeConfig:_,menuConfig:S,collections:g,collectionSchemas:j,refDocuments:h,themeCss:l,addSection:c,NotFoundComponent:x=ge}=e,v=(c==null?void 0:c.addableSectionTypes)??Object.keys(o).filter(L=>L!=="header"&&L!=="footer"),T={saveToFile:(F=e.persistence)==null?void 0:F.saveToFile,hotSave:(U=e.persistence)==null?void 0:U.hotSave,coldSave:(V=e.persistence)==null?void 0:V.coldSave,showLocalSave:((Y=e.persistence)==null?void 0:Y.showLocalSave)??!0,showHotSave:((B=e.persistence)==null?void 0:B.showHotSave)??!1,showColdSave:((H=e.persistence)==null?void 0:H.showColdSave)??!1},D=typeof(l==null?void 0:l.tenant)=="string"?l.tenant:"",y=typeof(l==null?void 0:l.admin)=="string"?l.admin:r,b=i.useMemo(()=>p.resolveRuntimeConfig({pages:f,siteConfig:C,themeConfig:_,menuConfig:S,collections:g,collectionSchemas:j,refDocuments:h}),[f,C,_,S,g,j,h]),[m,R]=i.useState(!1),I=p.normalizeBasePath(u);i.useEffect(()=>{var L,A;try{(L=b.themeConfig)!=null&&L.tokens&&$.setTheme(b.themeConfig)}catch(J){console.warn("[JsonPages] setTheme failed",J)}(A=e.webmcp)!=null&&A.enabled&&p.ensureWebMcpRuntime(),R(!0)},[b.themeConfig,(z=e.webmcp)==null?void 0:z.enabled]);const N={registry:a,schemas:o,pageRegistry:f,siteConfig:C,menuConfig:S,themeConfig:b.themeConfig,collections:g,collectionSchemas:j,refDocuments:h,addSectionConfig:c,addableSectionTypes:v,webmcp:e.webmcp,persistence:T,routerBasePath:I,tenantCss:D,adminCss:y,NotFoundComponent:x},M=i.useMemo(()=>{const L=k.createRoutesFromElements(s(N));return k.createBrowserRouter(L,{basename:I})},[x,c,v,y,b.themeConfig,S,g,j,f,T.coldSave,T.hotSave,T.saveToFile,T.showColdSave,T.showHotSave,T.showLocalSave,h,I,o,C,D,e.webmcp,s]);return m?n.jsx(he,{children:n.jsx(oe.Provider,{value:e.iconRegistry??{},children:n.jsx(be,{config:{registry:a,schemas:o,tenantId:e.tenantId??"default",basePath:I,assets:e.assets,overlayDisabledSectionTypes:e.overlayDisabledSectionTypes},children:n.jsx(k.RouterProvider,{router:M})})})}):n.jsx("div",{style:{minHeight:"100vh",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"#0f172a",color:"#94a3b8",fontFamily:"ui-sans-serif, system-ui, sans-serif",fontSize:14},children:"Loading..."})}const Ce=i.createContext(void 0),ee=({mode:e,children:s})=>(i.useEffect(()=>{if(e!=="studio")return;const r=new MutationObserver(a=>{a.forEach(o=>{o.addedNodes.forEach(u=>{u instanceof HTMLElement&&u.hasAttribute("data-radix-portal")&&u.setAttribute("data-jp-studio-portal","true")})})});return r.observe(document.body,{childList:!0}),()=>r.disconnect()},[e]),n.jsx(Ce.Provider,{value:{mode:e},children:s})),je=()=>{const e=i.useContext(Ce);if(e===void 0)throw new Error("useStudio must be used within a StudioProvider");return e};/**
+ * @license lucide-react v0.474.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const Oe=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),xe=(...e)=>e.filter((s,r,a)=>!!s&&s.trim()!==""&&a.indexOf(s)===r).join(" ").trim();/**
+ * @license lucide-react v0.474.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */var Ie={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};/**
+ * @license lucide-react v0.474.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const Ae=i.forwardRef(({color:e="currentColor",size:s=24,strokeWidth:r=2,absoluteStrokeWidth:a,className:o="",children:u,iconNode:f,...C},_)=>i.createElement("svg",{ref:_,...Ie,width:s,height:s,stroke:e,strokeWidth:a?Number(r)*24/Number(s):r,className:xe("lucide",o),...C},[...f.map(([S,g])=>i.createElement(S,g)),...Array.isArray(u)?u:[u]]));/**
+ * @license lucide-react v0.474.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const re=(e,s)=>{const r=i.forwardRef(({className:a,...o},u)=>i.createElement(Ae,{ref:u,iconNode:s,className:xe(`lucide-${Oe(e)}`,a),...o}));return r.displayName=`${e}`,r};/**
+ * @license lucide-react v0.474.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const Me=re("ChevronDown",[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]]);/**
+ * @license lucide-react v0.474.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const De=re("ChevronUp",[["path",{d:"m18 15-6-6-6 6",key:"153udz"}]]);/**
+ * @license lucide-react v0.474.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const Le=re("TriangleAlert",[["path",{d:"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",key:"wmoenq"}],["path",{d:"M12 9v4",key:"juzpu7"}],["path",{d:"M12 17h.01",key:"p32p05"}]]);class Fe extends i.Component{constructor(s){super(s),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(s,r){console.error(`[JsonPages] Component Crash [${this.props.type}]:`,s,r)}render(){return this.state.hasError?n.jsxs("div",{className:"p-8 m-4 bg-amber-500/5 border-2 border-dashed border-amber-500/20 rounded-xl flex flex-col items-center text-center gap-3",children:[n.jsx(Le,{className:"text-amber-500",size:32}),n.jsxs("div",{className:"space-y-1",children:[n.jsx("h4",{className:"text-sm font-bold text-amber-200 uppercase tracking-tight",children:"Component Error"}),n.jsxs("p",{className:"text-xs text-amber-500/70 font-mono",children:["Type: ",this.props.type]})]}),n.jsx("p",{className:"text-xs text-zinc-400 max-w-[280px] leading-relaxed",children:"This section failed to render. Check the console for details or verify the JSON data structure."})]}):this.props.children}}const Ue=({type:e,scope:s,isSelected:r,sectionId:a,sectionIndex:o=0,totalSections:u=0,onReorder:f})=>{const C=typeof o=="number"&&o>0&&f,_=typeof o=="number"&&o<u-1&&f;return n.jsx("div",{"data-jp-section-overlay":!0,"aria-hidden":!0,className:p.cn("absolute inset-0 pointer-events-none transition-all duration-200 z-[50]","border-2 border-transparent group-hover:border-blue-400/50 group-hover:border-dashed",r&&"border-2 border-blue-600 border-solid bg-blue-500/5"),children:n.jsxs("div",{className:p.cn("absolute top-0 right-0 flex flex-nowrap items-center gap-1 pl-1 pr-2 py-1 text-[9px] font-black uppercase tracking-widest transition-opacity pointer-events-auto","bg-blue-600 text-white",r||"group-hover:opacity-100 opacity-0"),children:[f&&a!=null&&n.jsxs("span",{className:"shrink-0 flex items-center gap-0.5",children:[n.jsx("button",{type:"button",onClick:S=>{S.stopPropagation(),C&&f(a,o-1)},disabled:!C,className:"inline-flex items-center justify-center min-w-[18px] min-h-[18px] rounded bg-white/20 hover:bg-white/30 disabled:opacity-30 disabled:pointer-events-none",title:"Move section up","aria-label":"Move section up",children:n.jsx(De,{size:12,strokeWidth:2.5})}),n.jsx("button",{type:"button",onClick:S=>{S.stopPropagation(),_&&f(a,o+2)},disabled:!_,className:"inline-flex items-center justify-center min-w-[18px] min-h-[18px] rounded bg-white/20 hover:bg-white/30 disabled:opacity-30 disabled:pointer-events-none",title:"Move section down","aria-label":"Move section down",children:n.jsx(Me,{size:12,strokeWidth:2.5})})]}),n.jsx("span",{className:"shrink-0",children:e}),n.jsx("span",{className:"opacity-50 shrink-0",children:"|"}),n.jsx("span",{className:"shrink-0",children:s})]})})},Q=({section:e,menu:s,selectedId:r,reorderable:a,sectionIndex:o,totalSections:u,onReorder:f})=>{const{mode:C}=je(),{registry:_,overlayDisabledSectionTypes:S}=Ee(),g=C==="studio",j=g&&r===e.id,h=_[e.type],l=e.type==="header"||e.type==="footer"?"global":"local",c=Array.isArray(S)?S.includes(e.type):!1,x=e.type==="header"&&typeof e.settings=="object"&&e.settings!==null&&"sticky"in e.settings&&!!e.settings.sticky;if(!h)return n.jsxs("div",{className:"p-6 m-4 bg-red-500/10 text-red-400 border border-red-500/20 rounded-lg text-sm font-mono",children:[n.jsx("strong",{children:"Missing Component:"})," ",e.type]});const v=()=>{const D=h;return s?n.jsx(D,{data:e.data,settings:e.settings,menu:s}):n.jsx(D,{data:e.data,settings:e.settings})},T=typeof e.data=="object"&&e.data!==null&&"anchorId"in e.data?String(e.data.anchorId??""):void 0;return n.jsxs("div",{id:T||void 0,"data-section-id":g?e.id:void 0,"data-section-type":g?e.type:void 0,"data-section-scope":g?l:void 0,...g&&j?{"data-jp-selected":!0}:{},className:p.cn("relative w-full",g&&!c&&"group cursor-pointer",g&&x?"sticky top-0 z-[60]":e.type==="header"?"relative":"relative z-0",j&&"z-[70]"),children:[n.jsx("div",{className:e.type==="header"?"relative":"relative z-0",children:n.jsx(Fe,{type:e.type,children:v()})}),g&&!c&&n.jsx(Ue,{type:e.type,scope:l,isSelected:!!j,sectionId:a&&l==="local"?e.id:void 0,sectionIndex:a&&l==="local"?o:void 0,totalSections:a&&l==="local"?u:void 0,onReorder:a&&l==="local"?f:void 0})]})},Te=e=>{i.useEffect(()=>{document.title=e.title;let s=document.querySelector('meta[name="description"]');s||(s=document.createElement("meta"),s.setAttribute("name","description"),document.head.appendChild(s)),s.setAttribute("content",e.description)},[e.title,e.description])},ze="application/json",ae=({pageConfig:e,siteConfig:s,menuConfig:r,selectedId:a,onReorder:o,scrollToSectionId:u,onActiveSectionChange:f})=>{Te(e.meta);const[C,_]=i.useState(null),S=i.useRef({}),g=i.useRef(f);g.current=f;const j=p.shouldRenderSiteGlobalHeader(e,s),h=j?s.header??null:null,l=s.footer??null,c=y=>{var b;(b=g.current)==null||b.call(g,y)};i.useEffect(()=>{if(!u)return;const y=S.current[u];y&&y.scrollIntoView({behavior:"smooth",block:"center"})},[u]),i.useEffect(()=>{if(!g.current)return;const b=[...h?[h.id]:[],...e.sections.map(N=>N.id),...l?[l.id]:[]],m=new IntersectionObserver(N=>{N.forEach(M=>{var F;if(M.isIntersecting&&M.intersectionRatio>.5){const U=M.target.getAttribute("data-section-id");U&&((F=g.current)==null||F.call(g,U))}})},{threshold:[0,.5,1],rootMargin:"-20% 0px -20% 0px"});let R=!1;const I=requestAnimationFrame(()=>{R||b.forEach(N=>{const M=S.current[N];M&&m.observe(M)})});return()=>{R=!0,cancelAnimationFrame(I),m.disconnect()}},[l,h,e.sections,e["global-header"],j]);const x=(y,b)=>{y.preventDefault(),y.dataTransfer.dropEffect="move",_(b)},v=()=>{_(null)},T=(y,b)=>{if(y.preventDefault(),_(null),!!o)try{const m=y.dataTransfer.getData(ze),{sectionId:R}=JSON.parse(m);typeof R=="string"&&o(R,b)}catch{}},D=()=>{const y=typeof o=="function",b=e.sections.map((m,R)=>{const I=C===R;return y?n.jsxs("div",{ref:N=>{S.current[m.id]=N},"data-section-id":m.id,style:{position:"relative"},onMouseEnter:()=>c(m.id),children:[n.jsx("div",{"data-jp-drop-zone":!0,style:{position:"absolute",left:0,right:0,top:-1,height:12,zIndex:55,pointerEvents:"auto",backgroundColor:I?"rgba(59, 130, 246, 0.4)":"transparent",borderTop:I?"2px solid rgb(96, 165, 250)":"2px solid transparent"},onDragOver:N=>x(N,R),onDragLeave:v,onDrop:N=>T(N,R)}),n.jsx(Q,{section:m,menu:p.resolveSectionMenuItems(m,r.main??[]),selectedId:a,reorderable:!0,sectionIndex:R,totalSections:e.sections.length,onReorder:o})]},m.id):n.jsx("div",{ref:N=>{S.current[m.id]=N},"data-section-id":m.id,onMouseEnter:()=>c(m.id),children:n.jsx(Q,{section:m,menu:p.resolveSectionMenuItems(m,r.main??[]),selectedId:a})},m.id)});if(y&&b.length>0){const m=e.sections.length,R=C===m;b.push(n.jsx("div",{"data-jp-drop-zone":!0,style:{position:"relative",left:0,right:0,height:24,minHeight:24,zIndex:55,pointerEvents:"auto",backgroundColor:R?"rgba(59, 130, 246, 0.4)":"transparent",borderTop:R?"2px solid rgb(96, 165, 250)":"2px solid transparent"},onDragOver:I=>x(I,m),onDragLeave:v,onDrop:I=>T(I,m)},"jp-drop-after-last"))}return b};return n.jsxs("div",{className:"min-h-screen flex flex-col bg-[var(--color-background)]",children:[h!=null&&n.jsx("div",{ref:y=>{S.current[h.id]=y},"data-section-id":h.id,onMouseEnter:()=>c(h.id),children:n.jsx(Q,{section:h,menu:p.resolveSectionMenuItems(h,r.main??[]),selectedId:a})}),n.jsx("main",{className:"flex-1",children:D()}),l!=null&&n.jsx("div",{ref:y=>{S.current[l.id]=y},"data-section-id":l.id,onMouseEnter:()=>c(l.id),children:n.jsx(Q,{section:l,menu:p.resolveSectionMenuItems(l,r.main??[]),selectedId:a})})]})},Ve='[data-jp-ignore-select="true"],[data-jp-interactive="true"],.ProseMirror,[contenteditable="true"],button,input,textarea,select,[role="button"],[role="menuitem"]',He="[data-jp-field],[data-jp-item-id],[data-jp-item-field]",we=()=>{var h;const[e,s]=i.useState(null),[r,a]=i.useState(null),[o,u]=i.useState({main:[]}),[f,C]=i.useState(null),[_,S]=i.useState(null);if(i.useEffect(()=>{const l=c=>{if(!(c.origin!==window.location.origin||c.source!==window.parent)&&(c.data.type===p.STUDIO_EVENTS.UPDATE_DRAFTS&&(s(c.data.draft),a(c.data.globalDraft),c.data.menuConfig&&u(c.data.menuConfig),c.data.themeConfig&&$.setTheme(c.data.themeConfig)),c.data.type===p.STUDIO_EVENTS.SYNC_SELECTION&&C(c.data.selectedId),c.data.type===p.STUDIO_EVENTS.REQUEST_SCROLL_TO_SECTION&&S(c.data.sectionId??null),c.data.type===p.STUDIO_EVENTS.REQUEST_INLINE_FLUSH)){const x=typeof c.data.requestId=="string"?c.data.requestId:null;window.dispatchEvent(new CustomEvent(p.STUDIO_EVENTS.REQUEST_INLINE_FLUSH,{detail:{requestId:x}})),setTimeout(()=>{window.parent.postMessage({type:p.STUDIO_EVENTS.INLINE_FLUSHED,requestId:x},window.location.origin)},0)}};return window.addEventListener("message",l),window.parent.postMessage({type:p.STUDIO_EVENTS.STAGE_READY},"*"),()=>window.removeEventListener("message",l)},[]),i.useEffect(()=>{const l=v=>!!v.closest(He),c=v=>!!(v.closest('[data-jp-ignore-select="true"]')||v.closest(Ve)&&!l(v)||v.closest("a[href]")&&!l(v)),x=v=>{var Y,B,H;const T=v.target;if(c(T)){T.closest("a[href]")&&v.preventDefault();return}const D=v.clientX,y=v.clientY;let b=null,m=T;for(;m&&m!==document.body;){const z=(Y=m.getAttribute)==null?void 0:Y.call(m,"data-section-id"),L=(B=m.getAttribute)==null?void 0:B.call(m,"data-section-type"),A=(H=m.getAttribute)==null?void 0:H.call(m,"data-section-scope");if(z&&L&&A){b=m;break}m=m.parentElement}if(!b)return;v.preventDefault(),v.stopPropagation();const R=b.getAttribute("data-section-id"),I=b.getAttribute("data-section-type"),N=b.getAttribute("data-section-scope");if(!R||!I||!N)return;const M={id:R,type:I,scope:N};if(T===b){window.parent.postMessage({type:p.STUDIO_EVENTS.SECTION_SELECT,section:M},"*");return}const F=document.elementFromPoint(D,y)??T;if(!F||!b.contains(F)){window.parent.postMessage({type:p.STUDIO_EVENTS.SECTION_SELECT,section:M},"*");return}if(F===b){window.parent.postMessage({type:p.STUDIO_EVENTS.SECTION_SELECT,section:M},"*");return}let U=p.buildSelectionPath(F,b);if(U.length===0&&F){let z=null;const L=A=>{var K,t;const J=A.getBoundingClientRect();if(J.left<=D&&D<=J.right&&J.top<=y&&y<=J.bottom){for(let d=0;d<A.children.length;d++)L(A.children[d]);((K=A.getAttribute)!=null&&K.call(A,"data-jp-item-id")||(t=A.getAttribute)!=null&&t.call(A,"data-jp-field"))&&(z=A)}};L(F),z&&(U=p.buildSelectionPath(z,b))}const V={type:p.STUDIO_EVENTS.SECTION_SELECT,section:M};U.length>0&&(V.itemPath=U),window.parent.postMessage(V,"*")};return document.addEventListener("click",x,!0),()=>document.removeEventListener("click",x,!0)},[]),i.useEffect(()=>{if(!_)return;const l=setTimeout(()=>S(null),600);return()=>clearTimeout(l)},[_]),!e||!r)return n.jsx("div",{className:"flex items-center justify-center h-screen w-full bg-zinc-950 text-zinc-500 font-mono text-xs uppercase tracking-widest animate-pulse",children:"Waiting for Studio Signal..."});const g={...o,main:p.resolveHeaderMenuItems((h=r.header)==null?void 0:h.data,o.main??[])},j=l=>{window.parent.postMessage({type:p.STUDIO_EVENTS.ACTIVE_SECTION_CHANGED,activeSectionId:l},"*")};return n.jsx(ee,{mode:"studio",children:n.jsx("div",{className:"jp-ice-active",children:n.jsx(ae,{pageConfig:e,siteConfig:r,menuConfig:g,selectedId:f,scrollToSectionId:_,onActiveSectionChange:j})})})},te=({mode:e,tenantCss:s,adminCss:r,children:a})=>(i.useLayoutEffect(()=>{const o=`jp-theme-${e}`,u=e==="tenant"?s:r;if(!document.getElementById(o)&&u){const f=document.createElement("style");f.id=o,f.innerHTML=u,document.head.appendChild(f)}return()=>{const f=document.getElementById(o);f&&f.remove()}},[e,s,r]),n.jsx(n.Fragment,{children:a})),ie=({tenantCss:e,adminCss:s})=>n.jsx(te,{mode:"tenant",tenantCss:e,adminCss:s,children:n.jsx(we,{})});let le=null;function Je(){return le||(le=import("@olonjs/studio")),le}const ce=({tenantCss:e,adminCss:s,...r})=>{const[a,o]=i.useState(null);i.useEffect(()=>{let f=!1;return Je().then(C=>{f||o(C)}),()=>{f=!0}},[]);const u=s||(a==null?void 0:a.adminSkinCss)||"";return n.jsx(te,{mode:"admin",tenantCss:e,adminCss:u,children:n.jsx(ee,{mode:"studio",children:a?n.jsx(a.StudioRouteBody,{...r}):n.jsx("div",{className:"flex items-center justify-center h-screen w-screen bg-zinc-950 text-zinc-500 font-mono text-xs uppercase tracking-widest animate-pulse",children:"Loading Studio..."})})})},Z=({pageRegistry:e,siteConfig:s,menuConfig:r,themeConfig:a,collections:o,collectionSchemas:u,refDocuments:f,tenantCss:C,adminCss:_,NotFoundComponent:S})=>{const g=k.useLocation(),j=p.resolveSlugFromPathname(g.pathname),h=i.useMemo(()=>p.resolvePageMatchFromRegistry(e,j),[e,j]),l=i.useMemo(()=>h?p.resolveCollectionContext(h.page,h.params,o):null,[o,h]),c=i.useMemo(()=>p.resolveRuntimeConfig({pages:h?{[h.registrySlug]:h.page}:{},siteConfig:s,themeConfig:a,menuConfig:r,collections:o,collectionSchemas:u,collectionContext:l,refDocuments:f}),[h,s,a,r,o,u,l,f]),x=h?c.pages[h.registrySlug]:void 0;return i.useEffect(()=>{var v;try{(v=c.themeConfig)!=null&&v.tokens&&$.setTheme(c.themeConfig)}catch(T){console.warn("[JsonPages] visitor theme resolution failed",T)}},[c.themeConfig]),i.useEffect(()=>{var D,y;if(!x)return;const v=typeof((D=x.meta)==null?void 0:D.title)=="string"?x.meta.title:j,T=typeof((y=x.meta)==null?void 0:y.description)=="string"?x.meta.description:"";p.syncHeadLink("mcp-manifest",p.buildPageManifestHref(j)),p.syncHeadLink("olon-contract",p.buildPageContractHref(j)),p.syncWebMcpJsonLd(v,T,j==="home"?"/":`/${j}`)},[x,j]),x?n.jsx(te,{mode:"tenant",tenantCss:C,adminCss:_,children:n.jsx(ee,{mode:"visitor",children:n.jsx(ae,{pageConfig:x,siteConfig:c.siteConfig,menuConfig:c.menuConfig})})}):n.jsx(S,{})};function Ye(e){const s={pageRegistry:e.pageRegistry,siteConfig:e.siteConfig,menuConfig:e.menuConfig,themeConfig:e.themeConfig,collections:e.collections,collectionSchemas:e.collectionSchemas,refDocuments:e.refDocuments,tenantCss:e.tenantCss,adminCss:e.adminCss,NotFoundComponent:e.NotFoundComponent},r={pageRegistry:e.pageRegistry,schemas:e.schemas,siteConfig:e.siteConfig,menuConfig:e.menuConfig,themeConfig:e.themeConfig,collections:e.collections,collectionSchemas:e.collectionSchemas,refDocuments:e.refDocuments,tenantCss:e.tenantCss,adminCss:e.adminCss,addSectionConfig:e.addSectionConfig,addableSectionTypes:e.addableSectionTypes,webMcp:e.webmcp,saveToFile:e.persistence.saveToFile,hotSave:e.persistence.hotSave,coldSave:e.persistence.coldSave,showLocalSave:e.persistence.showLocalSave,showHotSave:e.persistence.showHotSave,showColdSave:e.persistence.showColdSave};return n.jsxs(k.Route,{element:n.jsx(ye,{}),children:[n.jsx(k.Route,{path:"/",element:n.jsx(Z,{...s})}),n.jsx(k.Route,{path:"/*",element:n.jsx(Z,{...s})}),n.jsx(k.Route,{path:"/admin",element:n.jsx(ce,{...r})}),n.jsx(k.Route,{path:"/admin/*",element:n.jsx(ce,{...r})}),n.jsx(k.Route,{path:"/admin/preview",element:n.jsx(ie,{tenantCss:e.tenantCss,adminCss:e.adminCss})}),n.jsx(k.Route,{path:"/admin/preview/*",element:n.jsx(ie,{tenantCss:e.tenantCss,adminCss:e.adminCss})}),n.jsx(k.Route,{path:"*",element:n.jsx(e.NotFoundComponent,{})})]})}function Be({config:e}){return n.jsx(Se,{config:e,routesBuilder:Ye})}function We(e){const s={pageRegistry:e.pageRegistry,siteConfig:e.siteConfig,menuConfig:e.menuConfig,themeConfig:e.themeConfig,collections:e.collections,collectionSchemas:e.collectionSchemas,refDocuments:e.refDocuments,tenantCss:e.tenantCss,adminCss:e.adminCss,NotFoundComponent:e.NotFoundComponent};return n.jsxs(k.Route,{element:n.jsx(ye,{}),children:[n.jsx(k.Route,{path:"/",element:n.jsx(Z,{...s})}),n.jsx(k.Route,{path:"/*",element:n.jsx(Z,{...s})}),n.jsx(k.Route,{path:"*",element:n.jsx(e.NotFoundComponent,{})})]})}function Ge({config:e}){return n.jsx(Se,{config:e,routesBuilder:We})}const Xe={status:"idle",message:""},_e=i.createContext({});function Qe(e){return i.useContext(_e)[e]??Xe}Object.defineProperty(E,"buildThemeVariableMap",{enumerable:!0,get:()=>p.buildThemeVariableMap}),E.ConfigProvider=be,E.DefaultNotFound=ge,E.EngineErrorBoundary=he,E.IconRegistryContext=oe,E.JsonPagesEngine=Be,E.OlonFormsContext=_e,E.OlonJSEngine=Ge,E.PageRenderer=ae,E.PreviewEntry=we,E.PreviewRoute=ie,E.SectionRenderer=Q,E.StudioProvider=ee,E.StudioRoute=ce,E.ThemeLoader=te,E.VisitorRoute=Z,E.themeManager=$,E.useConfig=Ee,E.useDocumentMeta=Te,E.useFormState=Qe,E.useIconRegistry=Pe,E.useStudio=je,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -0,0 +1,70 @@
+{
+  "name": "@olonjs/react",
+  "version": "0.1.1",
+  "private": false,
+  "type": "module",
+  "main": "./dist/olonjs-react.umd.cjs",
+  "module": "./dist/olonjs-react.js",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/olonjs-react.js",
+      "require": "./dist/olonjs-react.umd.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist"
+  ],
+  "description": "React rendering bindings for the OlonJS engine (JsonPagesEngine, PageRenderer, ConfigContext). Depends on @olonjs/core; dynamically loads the optional @olonjs/studio editor for the /admin route.",
+  "author": "JsonPages Team",
+  "license": "MIT",
+  "homepage": "https://github.com/olonjs/npm-jpcore#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/olonjs/npm-jpcore.git",
+    "directory": "packages/react"
+  },
+  "bugs": {
+    "url": "https://github.com/olonjs/npm-jpcore/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "vite build",
+    "prepack": "node scripts/sync-peers-from-stack.js",
+    "test": "vitest run"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-router-dom": "^6.29.0",
+    "@olonjs/studio": "^0.1.1"
+  },
+  "peerDependenciesMeta": {
+    "@olonjs/studio": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "@olonjs/core": "^1.1.18",
+    "lucide-react": "^0.474.0"
+  },
+  "devDependencies": {
+    "@olonjs/stack": "^1.0.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.2.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^4.0.0",
+    "jsdom": "^26.0.0",
+    "typescript": "^5.7.3",
+    "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.0.0",
+    "vitest": "^3.0.0"
+  }
+}