@zeke-02/docx-editor-react 0.1.0

package/dist/plugin-api.mjs

@@ -0,0 +1,246 @@
+export{a as RenderedDomContextImpl,b as createRenderedDomContext}from'./chunk-UMM2BQ4N.mjs';import {a}from'./chunk-BMBP5UFA.mjs';import ie,{forwardRef,useState,useRef,useMemo,useSyncExternalStore,useEffect,useCallback,useImperativeHandle,cloneElement}from'react';import {TextSelection}from'prosemirror-state';import {PluginLifecycleManager,injectStyles}from'@zeke-02/docx-editor-core';import {jsx,jsxs}from'react/jsx-runtime';import*as ke from'@zeke-02/docx-editor-core/prosemirror/template/prosemirror-plugin';var z={position:"right",defaultSize:280,minSize:200,maxSize:500,resizable:true,collapsible:true,defaultCollapsed:false},j=injectStyles,J=`
+.plugin-host {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  overflow: visible;
+  position: relative;
+}
+
+.plugin-host-editor {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  overflow: visible;
+}
+
+
+.plugin-panels-left,
+.plugin-panels-right {
+  display: flex;
+  flex-direction: column;
+  flex-shrink: 0;
+  background: #f8f9fa;
+  border-color: #e9ecef;
+}
+
+.plugin-panels-left {
+  border-right: 1px solid #e9ecef;
+}
+
+.plugin-panels-right {
+  border-left: 1px solid #e9ecef;
+}
+
+.plugin-panels-bottom {
+  border-top: 1px solid #e9ecef;
+  background: #f8f9fa;
+}
+
+.plugin-panel {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  transition: width 0.2s ease, height 0.2s ease;
+}
+
+.plugin-panel.collapsed {
+  overflow: visible;
+}
+
+.plugin-panel-toggle {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding: 6px 8px;
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  font-size: 12px;
+  color: #6c757d;
+  white-space: nowrap;
+}
+
+.plugin-panel.collapsed .plugin-panel-toggle {
+  writing-mode: vertical-rl;
+  text-orientation: mixed;
+  flex-direction: column;
+  height: 100%;
+  padding: 8px 6px;
+}
+
+.plugin-panel-toggle:hover {
+  background: #e9ecef;
+  color: #495057;
+}
+
+.plugin-panel-toggle-icon {
+  font-weight: bold;
+  font-size: 14px;
+}
+
+.plugin-panel.collapsed .plugin-panel-toggle-icon {
+  transform: rotate(90deg);
+}
+
+.plugin-panel-toggle-label {
+  font-weight: 500;
+}
+
+.plugin-panel-content {
+  flex: 1;
+  overflow: auto;
+}
+
+/* Right panel rendered inside viewport - scrolls with content */
+.plugin-panel-in-viewport {
+  position: absolute;
+  top: 0;
+  /* Position is set dynamically via inline styles based on page edge */
+  width: 220px;
+  pointer-events: auto;
+  z-index: 10;
+  overflow: visible;
+}
+
+.plugin-panel-in-viewport.collapsed {
+  width: 32px;
+}
+
+.plugin-panel-in-viewport .plugin-panel-toggle {
+  position: sticky;
+  top: 0;
+  background: rgba(255, 255, 255, 0.95);
+  border-radius: 4px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+.plugin-panel-in-viewport-content {
+  overflow: visible;
+  position: relative;
+}
+
+/* Plugin overlay container for rendering highlights/decorations */
+.plugin-overlays-container {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+  overflow: visible;
+  z-index: 5;
+}
+
+.plugin-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+}
+
+/* Individual overlay children manage their own pointer-events.
+   Do NOT set pointer-events: auto here \u2014 it overrides overlay containers
+   that need pointer-events: none to let clicks pass through to the editor. */
+`,ve=forwardRef(function({plugins:d,children:g,className:p=""},u){let[n,y]=useState(null),f=useRef(g.props);f.current=g.props;let[a,S]=useState(null),i=useMemo(()=>new PluginLifecycleManager,[]),m=useSyncExternalStore(i.subscribe,i.getSnapshot),[h,T]=useState(()=>{let t=new Set;for(let e of d)({...z,...e.panelConfig}).defaultCollapsed&&t.add(e.id);return t}),[v]=useState(()=>{let t=new Map;for(let e of d){let o={...z,...e.panelConfig};t.set(e.id,o.defaultSize);}return t});useEffect(()=>{if(!n)return;let t=d.map(e=>({id:e.id,styles:e.styles,initialize:e.initialize,onStateChange:e.onStateChange,destroy:e.destroy}));return i.initialize(t,n),()=>{i.destroy();}},[i,n,d]),useEffect(()=>{let t=d.filter(e=>e.styles).map(e=>j(e.id,e.styles));return ()=>t.forEach(e=>e())},[d]),useEffect(()=>{if(!n?.dom)return;let t=()=>{i.updateStates(n);},e=null,o=()=>{e&&cancelAnimationFrame(e),e=requestAnimationFrame(t);};t();let s=n.dom;s.addEventListener("input",o),s.addEventListener("focus",t),s.addEventListener("click",t);let c=n.dispatch.bind(n);return n.dispatch=x=>{c(x),o();},()=>{s.removeEventListener("input",o),s.removeEventListener("focus",t),s.removeEventListener("click",t),e&&cancelAnimationFrame(e),n.dispatch=c;}},[n,i]),useEffect(()=>j("plugin-host-base",J),[]);let O=useCallback(t=>{if(!n)return;if(n.coordsAtPos(t)){n.dom.scrollIntoView({block:"center",inline:"nearest"});let{state:o}=n,s=o.doc.resolve(Math.min(t,o.doc.content.size)),c=o.tr.setSelection(TextSelection.near(s));n.dispatch(c),n.focus();}},[n]),k=useCallback((t,e)=>{if(!n)return;let{state:o}=n,s=o.doc.content.size,c=Math.max(0,Math.min(t,s)),x=Math.max(0,Math.min(e,s)),R=o.tr.setSelection(TextSelection.create(o.doc,c,x));n.dispatch(R),n.focus();},[n]),_=useCallback(t=>i.getPluginState(t),[i]),A=useCallback((t,e)=>{i.setPluginState(t,e);},[i]),F=useCallback(()=>{n&&i.updateStates(n);},[n,i]);useImperativeHandle(u,()=>({getPluginState:_,setPluginState:A,getEditorView:()=>n,refreshPluginStates:F}),[_,A,n,F]);let Y=useMemo(()=>{let t=[];for(let e of d)e.proseMirrorPlugins&&t.push(...e.proseMirrorPlugins);return t},[d]),M=useCallback(t=>{T(e=>{let o=new Set(e);return o.has(t)?o.delete(t):o.add(t),o});},[]),[$,N]=useState(null);useEffect(()=>{if(!a){N(null);return}let t=()=>{let s=a.pagesContainer,c=s.querySelector(".layout-page");if(!c){N(null);return}let x=a.getContainerOffset(),R=c.getBoundingClientRect(),D=s.getBoundingClientRect(),V=(R.right-D.left)/a.zoom,le=x.x+V+5;N(le);};t();let e=()=>{requestAnimationFrame(t);};window.addEventListener("resize",e);let o=new ResizeObserver(()=>{requestAnimationFrame(t);});return o.observe(a.pagesContainer),()=>{window.removeEventListener("resize",e),o.disconnect();}},[a]);let G=useMemo(()=>{let t=[];if(a){for(let e of d)if(e.renderOverlay){let o=m.states.get(e.id);t.push(jsx("div",{className:"plugin-overlay","data-plugin-id":e.id,children:e.renderOverlay(a,o,n)},`overlay-${e.id}`));}}for(let e of d){if(!e.Panel||(e.panelConfig?.position??"right")!=="right")continue;let s={...z,...e.panelConfig},c=h.has(e.id),x=v.get(e.id)??s.defaultSize,R=e.Panel,D=m.states.get(e.id),V=$!==null?`${$}px`:"calc(50% + 428px)";t.push(jsxs("div",{className:`plugin-panel-in-viewport ${c?"collapsed":""}`,style:{width:c?"32px":`${x}px`,left:V},"data-plugin-id":e.id,children:[s.collapsible&&jsx("button",{className:"plugin-panel-toggle",onClick:()=>M(e.id),title:c?`Show ${e.name}`:`Hide ${e.name}`,"aria-label":c?`Show ${e.name}`:`Hide ${e.name}`,children:jsx("span",{className:"plugin-panel-toggle-icon",children:c?"\u2039":"\u203A"})}),!c&&a&&jsx("div",{className:"plugin-panel-in-viewport-content",children:jsx(R,{editorView:n,doc:n?.state.doc??null,scrollToPosition:O,selectRange:k,pluginState:D,panelWidth:x,renderedDomContext:a})})]},`panel-overlay-${e.id}`));}return t.length>0?t:null},[a,d,m.version,n,h,v,O,k,M,$]),q=useMemo(()=>{let t=[];for(let e of d){if(!e.getSidebarItems)continue;let o=m.states.get(e.id),s={editorView:n,renderedDomContext:a,anchorPositions:new Map,zoom:a?.zoom??1},c=e.getSidebarItems(o,s);t.push(...c);}return t},[d,m.version,n,a]),U=useCallback(t=>{S(t);let e=f.current?.onRenderedDomContextReady;typeof e=="function"&&e(t);},[]),se=useMemo(()=>cloneElement(g,{externalPlugins:Y,pluginOverlays:G,pluginSidebarItems:q,pluginRenderedDomContext:a,onRenderedDomContextReady:U,onEditorViewReady:t=>{y(t);let e=f.current?.onEditorViewReady;typeof e=="function"&&e(t);}}),[g,Y,G,q,a,U]),H=useMemo(()=>{let t=[],e=[],o=[];for(let s of d){if(!s.Panel)continue;let c=s.panelConfig?.position??"right";c==="left"?t.push(s):c==="bottom"?o.push(s):e.push(s);}return {left:t,right:e,bottom:o}},[d]),W=t=>{if(!t.Panel)return null;let e={...z,...t.panelConfig},o=h.has(t.id),s=v.get(t.id)??e.defaultSize,c=t.Panel,x=m.states.get(t.id);return jsxs("div",{className:`plugin-panel plugin-panel-${e.position} ${o?"collapsed":""}`,style:{[e.position==="bottom"?"height":"width"]:o?"32px":`${s}px`,minWidth:e.position!=="bottom"?o?"32px":`${e.minSize}px`:void 0,maxWidth:e.position!=="bottom"?`${e.maxSize}px`:void 0,minHeight:e.position==="bottom"?o?"32px":`${e.minSize}px`:void 0,maxHeight:e.position==="bottom"?`${e.maxSize}px`:void 0},"data-plugin-id":t.id,children:[e.collapsible&&jsxs("button",{className:"plugin-panel-toggle",onClick:()=>M(t.id),title:o?`Show ${t.name}`:`Hide ${t.name}`,"aria-label":o?`Show ${t.name}`:`Hide ${t.name}`,children:[jsx("span",{className:"plugin-panel-toggle-icon",children:o?"\u203A":"\u2039"}),o&&jsx("span",{className:"plugin-panel-toggle-label",children:t.name})]}),!o&&jsx("div",{className:"plugin-panel-content",children:jsx(c,{editorView:n,doc:n?.state.doc??null,scrollToPosition:O,selectRange:k,pluginState:x,panelWidth:s,renderedDomContext:a??null})})]},t.id)};return jsxs("div",{className:`plugin-host ${p}`,children:[H.left.length>0&&jsx("div",{className:"plugin-panels-left",children:H.left.map(W)}),jsxs("div",{className:"plugin-host-editor",children:[se,H.bottom.length>0&&jsx("div",{className:"plugin-panels-bottom",children:H.bottom.map(W)})]})]})});var l={};a(l,ke);var Se={variable:"rgba(245, 158, 11, 0.3)",sectionStart:"rgba(59, 130, 246, 0.3)",sectionEnd:"rgba(59, 130, 246, 0.3)",invertedStart:"rgba(139, 92, 246, 0.3)",raw:"rgba(239, 68, 68, 0.3)"},Te={variable:"rgba(245, 158, 11, 0.5)",sectionStart:"rgba(59, 130, 246, 0.5)",sectionEnd:"rgba(59, 130, 246, 0.5)",invertedStart:"rgba(139, 92, 246, 0.5)",raw:"rgba(239, 68, 68, 0.5)"};function Z({context:r,tags:d,hoveredId:g,selectedId:p,onHover:u,onSelect:n}){let[y,f]=useState(0),a=useCallback(()=>{let i=r.getContainerOffset(),m=[];for(let h of d){let T=r.getRectsForRange(h.from,h.to);for(let v of T)m.push({tagId:h.id,tagType:h.type,x:v.x+i.x,y:v.y+i.y,width:v.width,height:v.height});}return m},[r,d]),S=useMemo(()=>a(),[a,y]);return useEffect(()=>{let i=()=>{requestAnimationFrame(()=>f(m=>m+1));};return window.addEventListener("resize",i),()=>window.removeEventListener("resize",i)},[]),useEffect(()=>{let i=new ResizeObserver(()=>{requestAnimationFrame(()=>f(m=>m+1));});return i.observe(r.pagesContainer),()=>i.disconnect()},[r.pagesContainer]),S.length===0?null:jsx("div",{className:"template-highlight-overlay",children:S.map((i,m)=>{let h=i.tagId===g,T=i.tagId===p,v=h||T?Te[i.tagType]:Se[i.tagType];return jsx("div",{className:`template-highlight ${h?"hovered":""} ${T?"selected":""}`,style:{position:"absolute",left:i.x,top:i.y,width:i.width,height:i.height,backgroundColor:v,borderRadius:2,cursor:"pointer"},onMouseEnter:()=>u?.(i.tagId),onMouseLeave:()=>u?.(void 0),onClick:()=>n?.(i.tagId)},`${i.tagId}-${m}`)})})}var ee=`
+.template-highlight-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+  overflow: visible;
+}
+
+.template-highlight {
+  pointer-events: auto;
+  transition: background-color 0.1s ease;
+}
+
+.template-highlight:hover,
+.template-highlight.hovered {
+  filter: brightness(0.9);
+}
+
+.template-highlight.selected {
+  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.6);
+}
+`;var we={variable:"#f59e0b",sectionStart:"#3b82f6",sectionEnd:"#3b82f6",invertedStart:"#8b5cf6",raw:"#ef4444"};function Ee(r){switch(r){case "sectionStart":return "LOOP / IF";case "invertedStart":return "IF NOT";case "raw":return "HTML";default:return ""}}var ne=`
+.template-annotation-chip {
+  display: inline-flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 4px;
+  padding: 5px 10px;
+  background: white;
+  border: 1px solid #e2e8f0;
+  border-left: 3px solid #6c757d;
+  border-radius: 4px;
+  font-size: 11px;
+  cursor: pointer;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
+  max-width: 200px;
+}
+
+.template-annotation-chip:hover,
+.template-annotation-chip.hovered {
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+  border-color: #cbd5e1;
+}
+
+.template-annotation-chip.selected {
+  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5);
+}
+
+.template-chip-badge {
+  font-size: 9px;
+  font-weight: 600;
+  padding: 1px 5px;
+  border-radius: 3px;
+  color: white;
+  text-transform: uppercase;
+  letter-spacing: 0.3px;
+}
+
+.template-chip-dot {
+  font-size: 8px;
+}
+
+.template-chip-name {
+  color: #334155;
+  font-weight: 500;
+}
+
+.template-chip-nested {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  width: 100%;
+  margin-top: 4px;
+  padding-top: 4px;
+  border-top: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+.template-nested-var {
+  font-size: 10px;
+  color: #64748b;
+  background: rgba(0, 0, 0, 0.04);
+  padding: 2px 6px;
+  border-radius: 3px;
+}
+
+.template-nested-var:hover {
+  background: rgba(59, 130, 246, 0.15);
+  color: #1e40af;
+}
+`;function oe({tag:r,isHovered:d,measureRef:g,onHover:p,onSelect:u}){let n=Ee(r.type),y=we[r.type],f=r.type==="sectionStart"||r.type==="invertedStart";return jsxs("div",{ref:g,style:{display:"flex",alignItems:"flex-start"},children:[jsx("div",{style:{width:20,height:1,background:d?"#3b82f6":"#d0d0d0",marginTop:12,marginRight:4,flexShrink:0}}),jsxs("div",{className:`template-annotation-chip ${d?"hovered":""}`,style:{borderLeftColor:y},onMouseEnter:()=>p(r.id),onMouseLeave:()=>p(void 0),onClick:a=>{a.stopPropagation(),u(r.id);},onMouseDown:a=>a.stopPropagation(),title:f?`${r.rawTag}
+Iterates over ${r.name}[]. Access nested properties via ${r.name}.property`:r.rawTag,children:[n&&jsx("span",{className:"template-chip-badge",style:{background:y},children:n}),!n&&jsx("span",{className:"template-chip-dot",style:{color:y},children:"\u25CF"}),jsx("span",{className:"template-chip-name",children:r.name}),f&&r.nestedVars&&r.nestedVars.length>0&&jsx("div",{className:"template-chip-nested",children:r.nestedVars.map((a,S)=>jsx("span",{className:"template-nested-var",title:`Access: ${r.name}.${a}`,children:a.includes(".")?a.split(".").pop():a},S))})]})]})}function re(r,d,g){if(!r)return;(0, l.setSelectedElement)(r,g);let p=d.find(u=>u.id===g);if(p){let u=r.state.tr.setSelection(TextSelection.near(r.state.doc.resolve(p.from)));r.dispatch(u),r.focus();}}function ae(r={}){return {id:"template",name:"Template",proseMirrorPlugins:[(0, l.createTemplatePlugin)()],onStateChange:g=>{let p=l.templatePluginKey.getState(g.state);if(p)return {tags:p.tags,hoveredId:p.hoveredId,selectedId:p.selectedId}},initialize:g=>({tags:[]}),getSidebarItems:(g,p)=>!g||g.tags.length===0?[]:g.tags.filter(n=>n.type!=="sectionEnd"&&!n.insideSection).map(n=>({id:`template-${n.id}`,anchorPos:n.from,priority:10,estimatedHeight:32,render:y=>ie.createElement(oe,{...y,tag:n,isHovered:n.id===g.hoveredId,onHover:f=>{p.editorView&&(0, l.setHoveredElement)(p.editorView,f);},onSelect:f=>re(p.editorView,g.tags,f)})})),renderOverlay:(g,p,u)=>!p||p.tags.length===0?null:ie.createElement(Z,{context:g,tags:p.tags,hoveredId:p.hoveredId,selectedId:p.selectedId,onHover:n=>{u&&(0, l.setHoveredElement)(u,n);},onSelect:n=>re(u,p.tags,n)}),styles:`
+${l.TEMPLATE_DECORATION_STYLES}
+${ne}
+${ee}
+`}}var Ce=ae();var export_TEMPLATE_DECORATION_STYLES=l.TEMPLATE_DECORATION_STYLES;var export_createTemplateProseMirrorPlugin=l.createTemplatePlugin;var export_getTemplatePluginTags=l.getTemplateTags;var export_setHoveredElement=l.setHoveredElement;var export_setSelectedElement=l.setSelectedElement;var export_templatePluginKey=l.templatePluginKey;export{J as PLUGIN_HOST_STYLES,ve as PluginHost,export_TEMPLATE_DECORATION_STYLES as TEMPLATE_DECORATION_STYLES,ae as createTemplatePlugin,export_createTemplateProseMirrorPlugin as createTemplateProseMirrorPlugin,export_getTemplatePluginTags as getTemplatePluginTags,export_setHoveredElement as setHoveredElement,export_setSelectedElement as setSelectedElement,Ce as templatePlugin,export_templatePluginKey as templatePluginKey};

package/dist/styles.css

@@ -0,0 +1 @@
+.ep-root .visible{visibility:visible}.ep-root .invisible{visibility:hidden}.ep-root .collapse{visibility:collapse}.ep-root .static{position:static}.ep-root .fixed{position:fixed}.ep-root .absolute{position:absolute}.ep-root .relative{position:relative}.ep-root .sticky{position:sticky}.ep-root .right-2{right:.5rem}.ep-root .z-50{z-index:50}.ep-root .-mx-1{margin-left:-.25rem;margin-right:-.25rem}.ep-root .mx-1\.5{margin-left:.375rem;margin-right:.375rem}.ep-root .mx-2{margin-left:.5rem;margin-right:.5rem}.ep-root .my-1{margin-bottom:.25rem;margin-top:.25rem}.ep-root .-ml-1{margin-left:-.25rem}.ep-root .mb-1{margin-bottom:.25rem}.ep-root .ml-auto{margin-left:auto}.ep-root .block{display:block}.ep-root .inline-block{display:inline-block}.ep-root .\!inline{display:inline!important}.ep-root .inline{display:inline}.ep-root .flex{display:flex}.ep-root .inline-flex{display:inline-flex}.ep-root .\!table{display:table!important}.ep-root .table{display:table}.ep-root .table-cell{display:table-cell}.ep-root .grid{display:grid}.ep-root .inline-grid{display:inline-grid}.ep-root .contents{display:contents}.ep-root .hidden{display:none}.ep-root .h-10{height:2.5rem}.ep-root .h-11{height:2.75rem}.ep-root .h-3\.5{height:.875rem}.ep-root .h-4{height:1rem}.ep-root .h-5{height:1.25rem}.ep-root .h-6{height:1.5rem}.ep-root .h-7{height:1.75rem}.ep-root .h-8{height:2rem}.ep-root .h-9{height:2.25rem}.ep-root .h-\[var\(--radix-select-trigger-height\)\]{height:var(--radix-select-trigger-height)}.ep-root .h-px{height:1px}.ep-root .max-h-72{max-height:18rem}.ep-root .max-h-\[300px\]{max-height:300px}.ep-root .max-h-\[400px\]{max-height:400px}.ep-root .min-h-\[36px\]{min-height:36px}.ep-root .w-10{width:2.5rem}.ep-root .w-3\.5{width:.875rem}.ep-root .w-4{width:1rem}.ep-root .w-5{width:1.25rem}.ep-root .w-7{width:1.75rem}.ep-root .w-9{width:2.25rem}.ep-root .w-full{width:100%}.ep-root .w-px{width:1px}.ep-root .min-w-0{min-width:0}.ep-root .min-w-\[100px\]{min-width:100px}.ep-root .min-w-\[260px\]{min-width:260px}.ep-root .min-w-\[55px\]{min-width:55px}.ep-root .min-w-\[70px\]{min-width:70px}.ep-root .min-w-\[8rem\]{min-width:8rem}.ep-root .min-w-\[var\(--radix-select-trigger-width\)\]{min-width:var(--radix-select-trigger-width)}.ep-root .max-w-\[300px\]{max-width:300px}.ep-root .flex-1{flex:1 1 0%}.ep-root .flex-shrink{flex-shrink:1}.ep-root .flex-shrink-0{flex-shrink:0}.ep-root .shrink{flex-shrink:1}.ep-root .shrink-0{flex-shrink:0}.ep-root .grow{flex-grow:1}.ep-root .transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ep-root .cursor-not-allowed{cursor:not-allowed}.ep-root .cursor-pointer{cursor:pointer}.ep-root .select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.ep-root .select-all{-webkit-user-select:all;-moz-user-select:all;user-select:all}.ep-root .resize{resize:both}.ep-root .flex-col{flex-direction:column}.ep-root .flex-wrap{flex-wrap:wrap}.ep-root .items-center{align-items:center}.ep-root .items-stretch{align-items:stretch}.ep-root .justify-center{justify-content:center}.ep-root .justify-between{justify-content:space-between}.ep-root .gap-0{gap:0}.ep-root .gap-0\.5{gap:.125rem}.ep-root .gap-1{gap:.25rem}.ep-root .gap-2{gap:.5rem}.ep-root .gap-px{gap:1px}.ep-root .overflow-hidden{overflow:hidden}.ep-root .overflow-x-auto{overflow-x:auto}.ep-root .truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ep-root .whitespace-nowrap{white-space:nowrap}.ep-root .rounded{border-radius:.25rem}.ep-root .rounded-full{border-radius:9999px}.ep-root .rounded-lg{border-radius:var(--radius)}.ep-root .rounded-md{border-radius:calc(var(--radius) - 2px)}.ep-root .rounded-none{border-radius:0}.ep-root .rounded-l-none{border-bottom-left-radius:0;border-top-left-radius:0}.ep-root .rounded-r-none{border-bottom-right-radius:0;border-top-right-radius:0}.ep-root .rounded-br-2xl{border-bottom-right-radius:1rem}.ep-root .\!border{border-width:1px!important}.ep-root .border{border-width:1px}.ep-root .border-0{border-width:0}.ep-root .border-r{border-right-width:1px}.ep-root .border-input{border-color:hsl(var(--input))}.ep-root .border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}.ep-root .border-slate-200\/50{border-color:rgba(226,232,240,.5)}.ep-root .border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.ep-root .bg-\[\#f1f5f9\]{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.ep-root .bg-background{background-color:hsl(var(--background))}.ep-root .bg-destructive{background-color:hsl(var(--destructive))}.ep-root .bg-doc-bg{background-color:var(--doc-bg)}.ep-root .bg-primary{background-color:hsl(var(--primary))}.ep-root .bg-secondary{background-color:hsl(var(--secondary))}.ep-root .bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.ep-root .bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity,1))}.ep-root .bg-slate-900{--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.ep-root .bg-transparent{background-color:transparent}.ep-root .bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.ep-root .p-1{padding:.25rem}.ep-root .px-1{padding-left:.25rem;padding-right:.25rem}.ep-root .px-1\.5{padding-left:.375rem;padding-right:.375rem}.ep-root .px-2{padding-left:.5rem;padding-right:.5rem}.ep-root .px-3{padding-left:.75rem;padding-right:.75rem}.ep-root .px-4{padding-left:1rem;padding-right:1rem}.ep-root .px-8{padding-left:2rem;padding-right:2rem}.ep-root .py-0{padding-bottom:0;padding-top:0}.ep-root .py-1{padding-bottom:.25rem;padding-top:.25rem}.ep-root .py-1\.5{padding-bottom:.375rem;padding-top:.375rem}.ep-root .py-2{padding-bottom:.5rem;padding-top:.5rem}.ep-root .py-2\.5{padding-bottom:.625rem;padding-top:.625rem}.ep-root .pb-1{padding-bottom:.25rem}.ep-root .pl-3{padding-left:.75rem}.ep-root .pr-1{padding-right:.25rem}.ep-root .pt-2{padding-top:.5rem}.ep-root .text-left{text-align:left}.ep-root .text-center{text-align:center}.ep-root .text-base{font-size:1rem;line-height:1.5rem}.ep-root .text-sm{font-size:.875rem;line-height:1.25rem}.ep-root .text-xs{font-size:.75rem;line-height:1rem}.ep-root .font-medium{font-weight:500}.ep-root .font-normal{font-weight:400}.ep-root .uppercase{text-transform:uppercase}.ep-root .capitalize{text-transform:capitalize}.ep-root .italic{font-style:italic}.ep-root .leading-tight{line-height:1.25}.ep-root .text-destructive-foreground{color:hsl(var(--destructive-foreground))}.ep-root .text-primary{color:hsl(var(--primary))}.ep-root .text-primary-foreground{color:hsl(var(--primary-foreground))}.ep-root .text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.ep-root .text-secondary-foreground{color:hsl(var(--secondary-foreground))}.ep-root .text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.ep-root .text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.ep-root .text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.ep-root .text-slate-800{--tw-text-opacity:1;color:rgb(30 41 59/var(--tw-text-opacity,1))}.ep-root .text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.ep-root .underline{text-decoration-line:underline}.ep-root .line-through{text-decoration-line:line-through}.ep-root .underline-offset-4{text-underline-offset:4px}.ep-root .opacity-30{opacity:.3}.ep-root .opacity-50{opacity:.5}.ep-root .shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.ep-root .shadow-lg,.ep-root .shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.ep-root .shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.ep-root .outline-none{outline:2px solid transparent;outline-offset:2px}.ep-root .outline{outline-style:solid}.ep-root .ring-offset-background{--tw-ring-offset-color:hsl(var(--background))}.ep-root .blur{--tw-blur:blur(8px)}.ep-root .blur,.ep-root .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ep-root .transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ep-root .transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ep-root .duration-150{transition-duration:.15s}.ep-root .ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ep-root .ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0) scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0) scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}.ep-root .zoom-in{--tw-enter-scale:0}.ep-root .zoom-out{--tw-exit-scale:0}.ep-root .duration-150{animation-duration:.15s}.ep-root .ease-in-out{animation-timing-function:cubic-bezier(.4,0,.2,1)}.ep-root .ease-out{animation-timing-function:cubic-bezier(0,0,.2,1)}.ep-root .running{animation-play-state:running}.ep-root{--background:0 0% 100%;--foreground:222.2 84% 4.9%;--card:0 0% 100%;--card-foreground:222.2 84% 4.9%;--popover:0 0% 100%;--popover-foreground:222.2 84% 4.9%;--primary:221.2 83.2% 53.3%;--primary-foreground:210 40% 98%;--secondary:210 40% 96.1%;--secondary-foreground:222.2 47.4% 11.2%;--muted:210 40% 96.1%;--muted-foreground:215.4 16.3% 46.9%;--accent:210 40% 96.1%;--accent-foreground:222.2 47.4% 11.2%;--destructive:0 84.2% 60.2%;--destructive-foreground:210 40% 98%;--border:214.3 31.8% 91.4%;--input:214.3 31.8% 91.4%;--ring:221.2 83.2% 53.3%;--radius:0.5rem;--doc-bg:#f8f9fa;--doc-primary:#1a73e8;--doc-primary-hover:#1557b0;--doc-primary-light:#e8f0fe;--doc-text:#202124;--doc-text-muted:#5f6368;--doc-text-subtle:#9aa0a6;--doc-text-placeholder:#999;--doc-border:#e0e0e0;--doc-border-light:#dadce0;--doc-border-dark:#d0d0d0;--doc-border-input:#ccc;--doc-bg-subtle:#f5f5f5;--doc-bg-hover:#f1f3f4;--doc-bg-input:#f8f9fa;--doc-error:#c5221f;--doc-error-bg:#fce8e6;--doc-success:#34a853;--doc-success-bg:#e8f5e9;--doc-warning:#f9a825;--doc-warning-bg:#fff8e1;--doc-link:#0563c1}[contenteditable=true]{caret-color:#000;outline:none;caret-shape:bar}.docx-run-editable[contenteditable=true]{caret-color:#000;display:inline;min-height:1em}.docx-paragraph-empty [contenteditable=true]{display:inline-block;min-height:1em;min-width:1px}.docx-paragraph-editable{cursor:text}.docx-run-editable[contenteditable=true]:focus{outline:none}.docx-paragraph-editable:focus-within{outline:none}.docx-run ::selection,.docx-run-editable ::selection,.docx-run-editable::selection,.docx-run::selection,[contenteditable=true] ::selection,[contenteditable=true]::selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-run ::-moz-selection,.docx-run-editable ::-moz-selection,.docx-run-editable::-moz-selection,.docx-run::-moz-selection,[contenteditable=true] ::-moz-selection,[contenteditable=true]::-moz-selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-paragraph ::selection,.docx-paragraph-editable ::selection,.docx-paragraph-editable::selection,.docx-paragraph::selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-paragraph ::-moz-selection,.docx-paragraph-editable ::-moz-selection,.docx-paragraph-editable::-moz-selection,.docx-paragraph::-moz-selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-hyperlink ::selection,.docx-hyperlink::selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-hyperlink ::-moz-selection,.docx-hyperlink::-moz-selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-run-highlighted ::selection,.docx-run-highlighted::selection{background-color:rgba(26,115,232,.5)!important;color:inherit!important}.docx-run-highlighted ::-moz-selection,.docx-run-highlighted::-moz-selection{background-color:rgba(26,115,232,.5)!important;color:inherit!important}.docx-run-dark-bg ::selection,.docx-run-dark-bg::selection{background-color:rgba(100,181,246,.5)!important;color:inherit!important}.docx-run-dark-bg ::-moz-selection,.docx-run-dark-bg::-moz-selection{background-color:rgba(100,181,246,.5)!important;color:inherit!important}.docx-run-bold ::selection,.docx-run-bold::selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-run-bold ::-moz-selection,.docx-run-bold::-moz-selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-run-italic ::selection,.docx-run-italic::selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-run-italic ::-moz-selection,.docx-run-italic::-moz-selection{background-color:rgba(26,115,232,.3)!important;color:inherit!important}.docx-find-highlight{background-color:rgba(255,235,59,.5)!important;border-radius:2px}.docx-find-highlight-current{background-color:rgba(255,152,0,.6)!important;border-radius:2px;outline:2px solid rgba(255,152,0,.8)}.docx-ai-selection-preview{background-color:rgba(156,39,176,.2);border-bottom:2px dashed rgba(156,39,176,.6)}.docx-selection-overlay-container{height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute;top:0;width:100%;z-index:1}.docx-selection-overlay-rect{background-color:rgba(66,133,244,.25);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none}.docx-run-highlighted[contenteditable=true]{caret-color:#333}.docx-run-dark-bg[contenteditable=true]{caret-color:#fff}.docx-editor{cursor:default}.docx-editor-page{cursor:text}.docx-bookmark-end,.docx-bookmark-start,.docx-drawing-placeholder,.docx-field,.docx-list-marker,.docx-shape-placeholder{cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none}.docx-run-has-variable [contenteditable=false]{cursor:default;-webkit-user-select:all;-moz-user-select:all;user-select:all}.layout-table-cell-selected{outline:2px solid rgba(66,133,244,.6);outline-offset:-2px;position:relative}.layout-table-cell-selected:after{background-color:rgba(66,133,244,.15);content:"";inset:0;pointer-events:none;position:absolute}.layout-table-resize-handle{background-color:transparent;transition:background-color .15s}.layout-table-resize-handle.dragging,.layout-table-resize-handle:hover{background-color:rgba(66,133,244,.6)}.layout-table-edge-handle-bottom,.layout-table-row-resize-handle{background-color:transparent;transition:background-color .15s}.layout-table-edge-handle-bottom.dragging,.layout-table-edge-handle-bottom:hover,.layout-table-row-resize-handle.dragging,.layout-table-row-resize-handle:hover{background-color:rgba(66,133,244,.6)}.layout-table-edge-handle-right{background-color:transparent;transition:background-color .15s}.layout-table-edge-handle-right.dragging,.layout-table-edge-handle-right:hover{background-color:rgba(66,133,244,.6)}.paged-editor--readonly .layout-table-edge-handle-bottom,.paged-editor--readonly .layout-table-edge-handle-right,.paged-editor--readonly .layout-table-resize-handle,.paged-editor--readonly .layout-table-row-resize-handle{display:none!important}.paged-editor--readonly .layout-page-footer,.paged-editor--readonly .layout-page-header{cursor:default;pointer-events:none}.paged-editor--readonly .layout-page-content{cursor:default}.docx-outline-heading-btn:hover{background-color:#f1f3f4}.layout-page-content{cursor:text}.layout-page-footer,.layout-page-header{cursor:pointer;transition:background-color .15s ease}.layout-page-footer:hover,.layout-page-header:hover{background-color:rgba(37,99,235,.06)}.layout-page-header:empty:hover:after{color:#9ca3af;content:"Double-click to add header";display:block;font-size:11px;padding:4px 0;text-align:center}.layout-page-footer:empty:hover:after{color:#9ca3af;content:"Double-click to add footer";display:block;font-size:11px;padding:4px 0;text-align:center}.paged-editor--hf-editing .layout-page-content{opacity:.4;pointer-events:none;transition:opacity .15s ease}.paged-editor--editing-header .layout-page-header{border-bottom:1px dotted #4285f4}.paged-editor--editing-footer .layout-page-footer{border-top:1px dotted #4285f4}.paged-editor--hf-editing .layout-page-footer:hover,.paged-editor--hf-editing .layout-page-header:hover{background-color:transparent}.docx-section-break{position:relative}.docx-section-break:after{border-top:1px dashed var(--doc-border,#d1d5db);color:var(--doc-text-muted,#9ca3af);content:"Section Break (" attr(data-section-break) ")";display:block;font-size:9px;margin-top:4px;padding-top:2px;pointer-events:none;text-align:center}.ep-hyperlink-popup__icon-btn:hover{background:#f1f3f4}.paged-editor__decoration-overlay{inset:0;pointer-events:none;position:absolute;z-index:11}.ProseMirror-yjs-cursor{border-left:1px solid;border-right:1px solid;margin-left:-1px;margin-right:-1px;pointer-events:none;position:relative;word-break:normal}.ProseMirror-yjs-cursor>div{border-radius:3px 3px 3px 0;color:#fff;font-size:11px;font-weight:600;left:-1px;line-height:1;padding:2px 4px;pointer-events:none;position:absolute;top:-1.05em;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.ep-root .first\:pl-0:first-child{padding-left:0}.ep-root .last\:border-r-0:last-child{border-right-width:0}.ep-root .hover\:border-slate-300:hover{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.ep-root .hover\:bg-accent:hover{background-color:hsl(var(--accent))}.ep-root .hover\:bg-destructive\/90:hover{background-color:hsl(var(--destructive)/.9)}.ep-root .hover\:bg-primary\/90:hover{background-color:hsl(var(--primary)/.9)}.ep-root .hover\:bg-secondary\/80:hover{background-color:hsl(var(--secondary)/.8)}.ep-root .hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.ep-root .hover\:bg-slate-100\/80:hover{background-color:rgba(241,245,249,.8)}.ep-root .hover\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.ep-root .hover\:bg-slate-800:hover{--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.ep-root .hover\:text-accent-foreground:hover{color:hsl(var(--accent-foreground))}.ep-root .hover\:text-slate-900:hover{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.ep-root .hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.ep-root .hover\:underline:hover{text-decoration-line:underline}.ep-root .focus\:bg-slate-100:focus{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.ep-root .focus\:bg-slate-100\/80:focus{background-color:rgba(241,245,249,.8)}.ep-root .focus\:bg-white:focus{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.ep-root .focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.ep-root .focus\:ring-1:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ep-root .focus\:ring-slate-300:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(203 213 225/var(--tw-ring-opacity,1))}.ep-root .focus\:ring-slate-400:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(148 163 184/var(--tw-ring-opacity,1))}.ep-root .focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.ep-root .focus-visible\:ring-2:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ep-root .focus-visible\:ring-ring:focus-visible{--tw-ring-color:hsl(var(--ring))}.ep-root .focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px}.ep-root .disabled\:pointer-events-none:disabled{pointer-events:none}.ep-root .disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.ep-root .disabled\:opacity-50:disabled{opacity:.5}.ep-root .data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.ep-root .data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:0.25rem}.ep-root .data-\[side\=bottom\]\:translate-y-1[data-side=bottom],.ep-root .data-\[side\=top\]\:-translate-y-1[data-side=top]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ep-root .data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:-0.25rem}.ep-root .data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.ep-root .data-\[state\=open\]\:animate-in[data-state=open]{animation-duration:.15s;animation-name:enter;--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial}.ep-root .data-\[state\=closed\]\:animate-out[data-state=closed]{animation-duration:.15s;animation-name:exit;--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial}.ep-root .data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.ep-root .data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.ep-root .data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.ep-root .data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.ep-root .data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:-0.5rem}.ep-root .data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:0.5rem}.ep-root :is(.\[\&\>span\]\:truncate>span){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

package/dist/styles.d.mts

@@ -0,0 +1,13 @@
+/**
+ * @zeke-02/docx-editor-react/styles
+ *
+ * CSS import entry. Bring in the editor's base styles by importing
+ * `@zeke-02/docx-editor-react/styles.css` directly; this module exists for
+ * tooling that prefers a JS-style import.
+ *
+ * @packageDocumentation
+ * @public
+ */
+declare const EDITOR_CSS_PATH = "./editor.css";
+
+export { EDITOR_CSS_PATH };

package/dist/styles.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @zeke-02/docx-editor-react/styles
+ *
+ * CSS import entry. Bring in the editor's base styles by importing
+ * `@zeke-02/docx-editor-react/styles.css` directly; this module exists for
+ * tooling that prefers a JS-style import.
+ *
+ * @packageDocumentation
+ * @public
+ */
+declare const EDITOR_CSS_PATH = "./editor.css";
+
+export { EDITOR_CSS_PATH };

package/dist/styles.js

@@ -0,0 +1 @@
+'use strict';require('./chunk-BJ5RZW6Y.js');var o="./editor.css";exports.EDITOR_CSS_PATH=o;

package/dist/styles.mjs

@@ -0,0 +1 @@
+import'./chunk-BMBP5UFA.mjs';var o="./editor.css";export{o as EDITOR_CSS_PATH};

package/dist/types-DaQbko33.d.mts

@@ -0,0 +1,106 @@
+import { EditorView } from 'prosemirror-view';
+import { ReactNode } from 'react';
+import { SidebarItem, EditorPluginCore, PluginPanelProps, RenderedDomContext, SidebarItemContext } from '@zeke-02/docx-editor-core/plugin-api';
+
+/**
+ * React Plugin Interface for the DOCX Editor
+ *
+ * Extends the framework-agnostic EditorPluginCore with React-specific
+ * UI rendering capabilities (Panel component, renderOverlay).
+ */
+
+/**
+ * React-specific editor plugin interface.
+ *
+ * Extends EditorPluginCore with:
+ * - Panel: React component for rendering in the annotation panel
+ * - renderOverlay: Function returning ReactNode for overlay rendering
+ */
+/**
+ * Render props passed to each sidebar item.
+ */
+interface SidebarItemRenderProps {
+    /** Whether this item is currently expanded/active. */
+    isExpanded: boolean;
+    /** Toggle expand/collapse for this item. */
+    onToggleExpand: () => void;
+    /** Ref callback to measure the rendered card height. */
+    measureRef: (el: HTMLDivElement | null) => void;
+}
+/**
+ * A sidebar item with React rendering, anchored to a document position.
+ */
+interface ReactSidebarItem extends SidebarItem {
+    /** Render the card content. */
+    render: (props: SidebarItemRenderProps) => ReactNode;
+    /** Estimated height in pixels (for pre-layout before measurement). Default: 40. */
+    estimatedHeight?: number;
+}
+interface ReactEditorPlugin<TState = any> extends EditorPluginCore<TState> {
+    /**
+     * React component to render in the annotation panel area.
+     * Receives editor state and callbacks for interaction.
+     */
+    Panel?: React.ComponentType<PluginPanelProps<TState>>;
+    /**
+     * Render an overlay on top of the rendered pages.
+     * Use this for highlights, annotations, or other visual elements
+     * that need to be positioned relative to the document content.
+     */
+    renderOverlay?: (context: RenderedDomContext, state: TState, editorView: EditorView | null) => ReactNode;
+    /**
+     * Provide sidebar items anchored to document positions.
+     * Called whenever plugin state changes.
+     * Items from all plugins are merged and laid out together in a unified sidebar.
+     */
+    getSidebarItems?: (state: TState, context: SidebarItemContext) => ReactSidebarItem[];
+}
+/**
+ * Backwards-compatible alias — EditorPlugin is now ReactEditorPlugin.
+ */
+type EditorPlugin<TState = any> = ReactEditorPlugin<TState>;
+/**
+ * Context value provided to plugins and panels.
+ */
+interface PluginContext {
+    /** All registered plugins */
+    plugins: EditorPlugin[];
+    /** Current editor view */
+    editorView: EditorView | null;
+    /** Set the editor view (called by editor on mount) */
+    setEditorView: (view: EditorView | null) => void;
+    /** Get plugin state by plugin ID */
+    getPluginState: <T>(pluginId: string) => T | undefined;
+    /** Update plugin state */
+    setPluginState: <T>(pluginId: string, state: T) => void;
+    /** Scroll to a position in the editor */
+    scrollToPosition: (pos: number) => void;
+    /** Select a range in the editor */
+    selectRange: (from: number, to: number) => void;
+}
+/**
+ * Props for the PluginHost component.
+ */
+interface PluginHostProps {
+    /** Plugins to enable */
+    plugins: EditorPlugin[];
+    /** The editor component (passed as child) */
+    children: React.ReactElement;
+    /** Class name for the host container */
+    className?: string;
+}
+/**
+ * Ref interface for the PluginHost component.
+ */
+interface PluginHostRef {
+    /** Get plugin state by plugin ID */
+    getPluginState: <T>(pluginId: string) => T | undefined;
+    /** Update plugin state for a plugin */
+    setPluginState: <T>(pluginId: string, state: T) => void;
+    /** Get the current editor view */
+    getEditorView: () => EditorView | null;
+    /** Force a refresh of all plugin states */
+    refreshPluginStates: () => void;
+}
+
+export type { EditorPlugin as E, PluginHostProps as P, ReactSidebarItem as R, SidebarItemRenderProps as S, PluginHostRef as a, ReactEditorPlugin as b, PluginContext as c };

package/dist/types-DaQbko33.d.ts

@@ -0,0 +1,106 @@
+import { EditorView } from 'prosemirror-view';
+import { ReactNode } from 'react';
+import { SidebarItem, EditorPluginCore, PluginPanelProps, RenderedDomContext, SidebarItemContext } from '@zeke-02/docx-editor-core/plugin-api';
+
+/**
+ * React Plugin Interface for the DOCX Editor
+ *
+ * Extends the framework-agnostic EditorPluginCore with React-specific
+ * UI rendering capabilities (Panel component, renderOverlay).
+ */
+
+/**
+ * React-specific editor plugin interface.
+ *
+ * Extends EditorPluginCore with:
+ * - Panel: React component for rendering in the annotation panel
+ * - renderOverlay: Function returning ReactNode for overlay rendering
+ */
+/**
+ * Render props passed to each sidebar item.
+ */
+interface SidebarItemRenderProps {
+    /** Whether this item is currently expanded/active. */
+    isExpanded: boolean;
+    /** Toggle expand/collapse for this item. */
+    onToggleExpand: () => void;
+    /** Ref callback to measure the rendered card height. */
+    measureRef: (el: HTMLDivElement | null) => void;
+}
+/**
+ * A sidebar item with React rendering, anchored to a document position.
+ */
+interface ReactSidebarItem extends SidebarItem {
+    /** Render the card content. */
+    render: (props: SidebarItemRenderProps) => ReactNode;
+    /** Estimated height in pixels (for pre-layout before measurement). Default: 40. */
+    estimatedHeight?: number;
+}
+interface ReactEditorPlugin<TState = any> extends EditorPluginCore<TState> {
+    /**
+     * React component to render in the annotation panel area.
+     * Receives editor state and callbacks for interaction.
+     */
+    Panel?: React.ComponentType<PluginPanelProps<TState>>;
+    /**
+     * Render an overlay on top of the rendered pages.
+     * Use this for highlights, annotations, or other visual elements
+     * that need to be positioned relative to the document content.
+     */
+    renderOverlay?: (context: RenderedDomContext, state: TState, editorView: EditorView | null) => ReactNode;
+    /**
+     * Provide sidebar items anchored to document positions.
+     * Called whenever plugin state changes.
+     * Items from all plugins are merged and laid out together in a unified sidebar.
+     */
+    getSidebarItems?: (state: TState, context: SidebarItemContext) => ReactSidebarItem[];
+}
+/**
+ * Backwards-compatible alias — EditorPlugin is now ReactEditorPlugin.
+ */
+type EditorPlugin<TState = any> = ReactEditorPlugin<TState>;
+/**
+ * Context value provided to plugins and panels.
+ */
+interface PluginContext {
+    /** All registered plugins */
+    plugins: EditorPlugin[];
+    /** Current editor view */
+    editorView: EditorView | null;
+    /** Set the editor view (called by editor on mount) */
+    setEditorView: (view: EditorView | null) => void;
+    /** Get plugin state by plugin ID */
+    getPluginState: <T>(pluginId: string) => T | undefined;
+    /** Update plugin state */
+    setPluginState: <T>(pluginId: string, state: T) => void;
+    /** Scroll to a position in the editor */
+    scrollToPosition: (pos: number) => void;
+    /** Select a range in the editor */
+    selectRange: (from: number, to: number) => void;
+}
+/**
+ * Props for the PluginHost component.
+ */
+interface PluginHostProps {
+    /** Plugins to enable */
+    plugins: EditorPlugin[];
+    /** The editor component (passed as child) */
+    children: React.ReactElement;
+    /** Class name for the host container */
+    className?: string;
+}
+/**
+ * Ref interface for the PluginHost component.
+ */
+interface PluginHostRef {
+    /** Get plugin state by plugin ID */
+    getPluginState: <T>(pluginId: string) => T | undefined;
+    /** Update plugin state for a plugin */
+    setPluginState: <T>(pluginId: string, state: T) => void;
+    /** Get the current editor view */
+    getEditorView: () => EditorView | null;
+    /** Force a refresh of all plugin states */
+    refreshPluginStates: () => void;
+}
+
+export type { EditorPlugin as E, PluginHostProps as P, ReactSidebarItem as R, SidebarItemRenderProps as S, PluginHostRef as a, ReactEditorPlugin as b, PluginContext as c };