omi-reactify/dist/index.umd.js

Bridge between omi and react

(function(u,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("react"),require("react-dom"),require("react-dom/client")):typeof define=="function"&&define.amd?define(["exports","react","react-dom","react-dom/client"],l):(u=typeof globalThis<"u"?globalThis:u||self,l(u.index={},u.React,u.ReactDOM,u.client))})(this,function(u,l,g,b){"use strict";const C=()=>typeof b.createRoot<"u",x=()=>parseInt(l.version.split(".")[0],10)>=19,S=new WeakMap,E=n=>{if(C()){let c=S.get(n);return c||(c={root:b.createRoot(n)},S.set(n,c)),{render:f=>{c.lastElement!==f&&(c.root.render(f),c.lastElement=f)},unmount:()=>{c.root.unmount(),S.delete(n)}}}return{render:c=>{g.render(c,n)},unmount:()=>{g.unmountComponentAtNode(n)}}},A=n=>n&&typeof n=="object"&&n.$$typeof&&n.$$typeof.toString().includes("react"),h=n=>n!=null&&(typeof n=="string"||typeof n=="number"||typeof n=="boolean"||A(n)||Array.isArray(n)),w=/\B([A-Z])/g;function p(n){return n.replace(w,"-$1").toLowerCase()}const $=n=>{if(!n||typeof n!="object")return"";const c=new Set(["animationIterationCount","boxFlex","boxFlexGroup","boxOrdinalGroup","columnCount","fillOpacity","flex","flexGrow","flexShrink","fontWeight","lineClamp","lineHeight","opacity","order","orphans","tabSize","widows","zIndex","zoom"]);return Object.entries(n).filter(([,f])=>f!=null&&f!=="").map(([f,e])=>{const t=f.replace(/[A-Z]/g,s=>`-${s.toLowerCase()}`);let r=e;return typeof e=="number"&&e!==0&&!c.has(f)&&(r=`${e}px`),`${t}:${r};`}).join(" ")},y={"t-chatbot":n=>n.startsWith("sender-"),"t-chat-item":n=>n==="actionbar"},P=n=>{class c extends l.Component{constructor(e){super(e),this.processingSlots=new Set,this.lastRenderedElements=new Map,this.eventHandlers=[],this.slotRenderers=new Map;const{innerRef:t}=e;this.ref=t||l.createRef()}setEvent(e,t){var r;this.eventHandlers.push([e,t]),(r=this.ref.current)==null||r.addEventListener(e,t)}handleSlotProp(e,t){const r=this.ref.current;if(!r||this.processingSlots.has(e))return;let s=e;e.endsWith("Slot")&&(s=e.slice(0,-4)),s=p(s);const o=this.slotRenderers.get(s);if(!(o&&this.isSameReactElement(s,t)))if(this.processingSlots.add(e),h(t)&&this.lastRenderedElements.set(s,t),typeof t=="function"){o&&this.cleanupSlotRenderer(s);const i=a=>{const d=t(a);return this.renderReactNodeToSlot(d,s)};r[e]=i,this.processingSlots.delete(e)}else h(t)&&(r[e]=!0,Promise.resolve().then(()=>{var i;o?this.updateSlotContent(s,t):!o&&((i=y[n])!=null&&i.call(y,s))?(this.renderReactNodeToSlot(t,s),r.update&&r.update()):(r.update&&r.update(),this.renderReactNodeToSlot(t,s)),this.processingSlots.delete(e)}))}cleanupSlotRenderer(e){const t=this.slotRenderers.get(e);t&&(this.clearSlotContainers(e),Promise.resolve().then(()=>{c.safeCleanupRenderer(t)}),this.slotRenderers.delete(e))}updateSlotContent(e,t){const r=this.ref.current;if(!r)return;const s=r.querySelector(`[slot="${e}"]`);if(s&&h(t))try{l.isValidElement(t)?E(s).render(t):(typeof t=="string"||typeof t=="number")&&(s.textContent=String(t))}catch(o){console.warn("[reactify] Error updating slot content:",o),this.cleanupSlotRenderer(e),this.renderReactNodeToSlot(t,e)}else this.renderReactNodeToSlot(t,e)}static safeCleanupRenderer(e){try{e()}catch(t){console.warn("Error cleaning up React renderer:",t)}}clearSlotContainers(e){const t=this.ref.current;if(t)try{t.querySelectorAll(`[slot="${e}"]`).forEach(s=>{if(s.parentNode&&s.parentNode.contains(s))try{s.parentNode.removeChild(s)}catch(o){console.warn(`[reactify] Error removing slot container for "${e}":`,o)}})}catch(r){console.warn(`[reactify] Error clearing slot containers for "${e}":`,r)}}isSameReactElement(e,t){const r=this.lastRenderedElements.get(e);return!r||!h(t)?!1:r===t?!0:(l.isValidElement(r)&&l.isValidElement(t),!1)}renderReactNodeToSlot(e,t){const r=this.ref.current;if(!r||r.querySelectorAll(`[slot="${t}"]`).length>0)return;const o=document.createElement("div");o.style.display="contents",o.setAttribute("slot",t),r.appendChild(o);let i=null;if(h(e)){if(l.isValidElement(e))try{const a=E(o);a.render(e),i=()=>{try{a.unmount()}catch(d){console.warn("Error unmounting React renderer:",d)}}}catch(a){console.warn("Error creating React renderer:",a)}else if(typeof e=="string"||typeof e=="number")o.textContent=String(e),i=()=>{o.textContent=""};else if(Array.isArray(e))try{const a=E(o),d=l.createElement("div",{style:{display:"contents"}},...e.filter(h));a.render(d),i=()=>{try{a.unmount()}catch(m){console.warn("Error unmounting React renderer:",m)}}}catch(a){console.warn("Error creating React renderer for array:",a)}}this.slotRenderers.set(t,()=>{this.lastRenderedElements.delete(t),Promise.resolve().then(()=>{i&&i(),o.parentNode&&o.parentNode.removeChild(o)})})}update(){this.clearEventHandlers(),this.ref.current&&Object.entries(this.props).forEach(([e,t])=>{var r,s,o,i,a;if(!["innerRef","children"].includes(e)){if(typeof t=="function"&&e.match(/^on[A-Za-z]/)){const d=e.slice(2),m=d[0].toLowerCase()+d.slice(1);this.setEvent(m,t);return}if(typeof t=="function"&&e.match(/^render[A-Za-z]/)){this.handleSlotProp(e,t);return}if(h(t)&&!e.match(/^on[A-Za-z]/)&&!e.match(/^render[A-Za-z]/)){const d=e.endsWith("Slot"),m=p(d?e.slice(0,-4):e);let R=((s=(r=this.ref.current)==null?void 0:r.shadowRoot)==null?void 0:s.querySelector(`slot[name="${m}"]`))!==null;if(!R&&y[n]&&(R=y[n](m)),R){this.handleSlotProp(e,t);return}}if(typeof t=="object"&&t!==null){if(e==="style"){(o=this.ref.current)==null||o.setAttribute("style",$(t));return}this.ref.current[e]=t;return}if(typeof t=="function"){this.ref.current[e]=t;return}if(e.match(w)){(i=this.ref.current)==null||i.setAttribute(p(e),t),(a=this.ref.current)==null||a.removeAttribute(e);return}x()||(this.ref.current[e]=t)}})}componentDidUpdate(){this.update()}componentDidMount(){this.update()}componentWillUnmount(){this.clearEventHandlers(),this.clearSlotRenderers()}clearEventHandlers(){this.eventHandlers.forEach(([e,t])=>{var r;(r=this.ref.current)==null||r.removeEventListener(e,t)}),this.eventHandlers=[]}clearSlotRenderers(){this.slotRenderers.forEach(e=>{c.safeCleanupRenderer(e)}),this.slotRenderers.clear(),this.processingSlots.clear()}render(){const{children:e,className:t,...r}=this.props,s={};return Object.keys(r).forEach(o=>{const i=r[o];(typeof i=="string"||typeof i=="number"||typeof i=="boolean")&&(s[o]=i)}),l.createElement(n,{class:t,...s,ref:this.ref},e)}}return l.forwardRef((f,e)=>l.createElement(c,{...f,innerRef:e}))};u.default=P,u.hyphenate=p,Object.defineProperties(u,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});