@univerjs/docs-quick-insert-ui 0.20.1 → 0.21.0-insiders.20260422-d7fcb4d
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/index.js +1083 -1
- package/lib/cjs/locale/ca-ES.js +18 -1
- package/lib/cjs/locale/en-US.js +33 -1
- package/lib/cjs/locale/es-ES.js +18 -1
- package/lib/cjs/locale/fa-IR.js +18 -1
- package/lib/cjs/locale/fr-FR.js +18 -1
- package/lib/cjs/locale/ja-JP.js +18 -1
- package/lib/cjs/locale/ko-KR.js +18 -1
- package/lib/cjs/locale/ru-RU.js +18 -1
- package/lib/cjs/locale/sk-SK.js +18 -1
- package/lib/cjs/locale/vi-VN.js +18 -1
- package/lib/cjs/locale/zh-CN.js +18 -1
- package/lib/cjs/locale/zh-TW.js +18 -1
- package/lib/es/index.js +1057 -1
- package/lib/es/locale/ca-ES.js +17 -1
- package/lib/es/locale/en-US.js +32 -1
- package/lib/es/locale/es-ES.js +17 -1
- package/lib/es/locale/fa-IR.js +17 -1
- package/lib/es/locale/fr-FR.js +17 -1
- package/lib/es/locale/ja-JP.js +17 -1
- package/lib/es/locale/ko-KR.js +17 -1
- package/lib/es/locale/ru-RU.js +17 -1
- package/lib/es/locale/sk-SK.js +17 -1
- package/lib/es/locale/vi-VN.js +17 -1
- package/lib/es/locale/zh-CN.js +17 -1
- package/lib/es/locale/zh-TW.js +17 -1
- package/lib/index.js +1057 -1
- package/lib/locale/ca-ES.js +17 -1
- package/lib/locale/en-US.js +32 -1
- package/lib/locale/es-ES.js +17 -1
- package/lib/locale/fa-IR.js +17 -1
- package/lib/locale/fr-FR.js +17 -1
- package/lib/locale/ja-JP.js +17 -1
- package/lib/locale/ko-KR.js +17 -1
- package/lib/locale/ru-RU.js +17 -1
- package/lib/locale/sk-SK.js +17 -1
- package/lib/locale/vi-VN.js +17 -1
- package/lib/locale/zh-CN.js +17 -1
- package/lib/locale/zh-TW.js +17 -1
- package/lib/umd/index.js +1 -1
- package/package.json +14 -14
- package/LICENSE +0 -176
package/lib/es/index.js
CHANGED
|
@@ -1 +1,1057 @@
|
|
|
1
|
-
import{CommandType as e,DeleteDirection as t,DependentOn as n,Direction as r,Disposable as i,DisposableCollection as a,ICommandService as o,IConfigService as s,IUniverInstanceService as c,Inject as l,Injector as u,LocaleService as d,Plugin as f,RANGE_DIRECTION as p,UniverInstanceType as m,generateRandomId as h,merge as g,toDisposable as _}from"@univerjs/core";import{DocSelectionManagerService as v,DocSkeletonManagerService as y,RichTextEditingMutation as b}from"@univerjs/docs";import{BulletListCommand as ee,CutContentCommand as x,DeleteCommand as S,DeleteLeftCommand as C,DocCanvasPopManagerService as w,DocCreateTableOperation as te,DocEventManagerService as T,HorizontalLineCommand as ne,IMEInputCommand as re,InsertCommand as ie,MoveCursorOperation as ae,NodePositionConvertToCursor as oe,OrderListCommand as se,getAnchorBounding as ce}from"@univerjs/docs-ui";import{ComponentManager as le,ILayoutService as ue,IShortcutService as de,KeyCode as E,UniverUIPlugin as fe,useDependency as D,useEvent as pe,useObservable as O}from"@univerjs/ui";import{IRenderManagerService as k,ptToPixel as me}from"@univerjs/engine-render";import{BehaviorSubject as A,combineLatest as j,distinctUntilChanged as he,map as ge,of as _e,tap as M}from"rxjs";import{useEffect as N,useMemo as P,useRef as F,useState as ve}from"react";import{jsx as I,jsxs as L}from"react/jsx-runtime";import{Tooltip as ye,borderBottomClassName as be,borderClassName as xe,clsx as R,scrollbarClassName as Se}from"@univerjs/design";import{InsertDocImageCommand as Ce,UniverDocsDrawingUIPlugin as we}from"@univerjs/docs-drawing-ui";import{DividerIcon as Te,IncreaseIcon as Ee,TextIcon as De}from"@univerjs/icons";import{UniverDocsDrawingPlugin as Oe}from"@univerjs/docs-drawing";import{UniverDrawingPlugin as ke}from"@univerjs/drawing";import{UniverDrawingUIPlugin as Ae}from"@univerjs/drawing-ui";const je={id:`doc.command.delete-search-key`,type:e.COMMAND,handler:(e,t)=>{let n=e.get(o),{start:r,end:i}=t;return n.syncExecuteCommand(x.id,{segmentId:``,textRanges:[{startOffset:r,endOffset:r,collapsed:!0}],selections:[{startOffset:r,endOffset:i,collapsed:!1,direction:p.FORWARD}]})}},Me=`docs.quick.insert.keyword-input-placeholder`;function Ne(e,t){if(typeof document>`u`)return e.length*11;let n=document.createElement(`canvas`).getContext(`2d`);return n?(n.font=t,Math.ceil(n.measureText(e).width)):e.length*11}const z=({popup:e})=>{var t,n,r,i,a,o,s,c,l,u,f;let p=D(d).t(`docQuickInsert.keywordInputPlaceholder`),m=me((t=(n=e.extraProps)==null?void 0:n.fontSize)==null?11:t),h=(r=(i=e.extraProps)==null?void 0:i.fontString)==null?`${m}px sans-serif`:r,g=(a=(o=e.extraProps)==null?void 0:o.ascent)==null?m:a,_=Math.max((s=(c=e.extraProps)==null?void 0:c.contentHeight)==null?m:s,m),v=P(()=>Ne(p,h),[h,p]);return I(`div`,{className:`univer-select-none univer-font-normal univer-text-gray-500 univer-transition-colors dark:!univer-text-gray-400`,children:I(`svg`,{width:v,height:_,viewBox:`0 0 ${v} ${_}`,style:{overflow:`visible`,display:`block`},children:I(`text`,{x:0,y:g,fill:`currentColor`,style:{font:h,fontFamily:(l=e.extraProps)==null?void 0:l.fontFamily,fontStyle:(u=e.extraProps)==null?void 0:u.fontStyle,fontWeight:(f=e.extraProps)==null?void 0:f.fontWeight},children:p})})})};z.componentKey=Me;function Pe(e){return`children`in e}function B(e){return e.flatMap(e=>Pe(e)?B(e.children):e)}function Fe(e){return B(e).length}function Ie(e){let{menus:t,focusedMenuIndex:n,focusedMenuRef:r,menuNodeMapRef:i,componentManager:a,onFocusedMenuIndexChange:o,onSelect:s}=e,c=P(()=>B(t),[t]);N(()=>{var e,t;let a=Number.isNaN(n)||(e=c[n])==null?null:e;r.current=a,a&&((t=i.current.get(a.id))==null||t.scrollIntoView({block:`nearest`}))},[c,n,r,i]);let l=F(0);l.current=0;function u(e){return e.map((t,r)=>{let c=t.icon,d=c?a.get(c):null;if(Pe(t))return L(`div`,{className:R(`univer-grid univer-gap-1 univer-py-1`,r!==e.length-1&&be),children:[L(`div`,{className:`univer-box-border univer-inline-flex univer-items-center univer-gap-2 univer-px-2 univer-text-xs univer-font-semibold univer-text-gray-600 dark:!univer-text-gray-300`,children:[d&&I(`span`,{className:`univer-inline-flex univer-text-base`,children:I(d,{})}),I(`span`,{children:t.title})]}),I(`div`,{className:`univer-grid univer-gap-1`,children:u(t.children)})]},t.id);let f=l.current,p=n===f;return l.current+=1,I(`div`,{ref:e=>{if(e){i.current.set(t.id,e);return}i.current.delete(t.id)},role:`button`,tabIndex:-1,className:R(`univer-relative univer-box-border univer-flex univer-min-h-8 univer-w-full univer-cursor-pointer univer-items-center univer-justify-between univer-gap-3 univer-rounded-md univer-border-none univer-bg-transparent univer-px-2 univer-text-left univer-text-sm univer-text-gray-900 univer-outline-none hover:univer-bg-gray-50 dark:!univer-text-white dark:hover:!univer-bg-gray-600`,{"hover:univer-bg-transparent":!p,"univer-bg-gray-50 dark:!univer-bg-gray-600":p}),onMouseEnter:()=>o(f),onMouseLeave:()=>o(NaN),onClick:()=>s(t),children:L(`div`,{className:`univer-inline-flex univer-w-full univer-items-center univer-gap-2`,children:[d&&I(`span`,{className:`univer-inline-flex univer-text-base`,children:I(d,{})}),I(ye,{showIfEllipsis:!0,title:t.title,placement:`right`,children:I(`span`,{className:`univer-truncate`,children:t.title})})]})},t.id)})}return I(`div`,{className:R(`univer-box-border univer-grid univer-max-h-[360px] univer-gap-1 univer-overflow-y-auto univer-overflow-x-hidden univer-overscroll-contain univer-rounded-md univer-bg-white univer-px-2 univer-py-1 univer-text-sm univer-text-gray-900 univer-shadow-md dark:!univer-bg-gray-700 dark:!univer-text-white`,xe,Se),onWheel:e=>e.stopPropagation(),children:u(t)})}const Le=`docs.quick.insert.placeholder`,V=()=>I(`div`,{className:`univer-flex univer-h-full univer-items-center univer-justify-center univer-rounded-lg univer-bg-white univer-px-12 univer-py-6 univer-text-gray-400 univer-shadow-lg`,children:I(`span`,{children:D(d).t(`docQuickInsert.placeholder`)})});V.componentKey=Le;function H(e,t){return e.map(e=>({...e})).filter(e=>{if(`children`in e)return e.children=H(e.children,t),e.children.length>0;let n=e.keywords;return n?n.some(e=>e.includes(t)):e.title.toLowerCase().includes(t)})}function Re(e,t){return e.map(e=>{let n={...e};return`children`in n&&(n.children=Re(n.children,t)),n.title=t.t(n.title),`keywords`in n&&(n.keywords=n.keywords.concat(n.title).map(e=>e.toLowerCase())),n})}const ze=[E.ARROW_UP,E.ARROW_DOWN,E.ENTER],U=()=>{let t=D(d),n=D(J),i=D(le),s=D(de),c=D(o),l=P(()=>h(),[]),[u,f]=ve(0),p=F(null),m=O(n.filterKeyword$,``),g=O(n.editPopup$),v=O(g==null?void 0:g.popup.menus$,[]),y=P(()=>Re(v,t),[v]),[b,ee]=ve(()=>H(y,m.toLowerCase())),x=P(()=>Fe(b),[b]),S=F(x);N(()=>{S.current=x},[x]),N(()=>{let e=requestIdleCallback(()=>{ee(H(y,m.toLowerCase()))});return()=>{cancelIdleCallback(e)}},[y,m]);let C=e=>{n.emitMenuSelected(e),c.executeCommand(Y.id)};N(()=>{let t=new a;s.getAllShortcuts().filter(e=>e.binding&&ze.includes(e.binding)).forEach(e=>{let n=e.preconditions;e.preconditions=()=>!1,t.add(_(()=>{e.preconditions=n}))});let n={id:`quick.insert.popup.enter.${l}`,type:e.OPERATION,handler:()=>{let e=p.current;e&&C(e)}},i={id:`quick.insert.popup.move.cursor.up.${l}`,type:e.OPERATION,handler:()=>{f(e=>{if(S.current<=0)return 0;let t=e-1;return t>=0?t:S.current-1})}},o={id:`quick.insert.popup.move.cursor.down.${l}`,type:e.OPERATION,handler:()=>{f(e=>{if(S.current<=0)return 0;let t=e+1;return t<=S.current-1?t:0})}};return t.add(c.registerCommand(i)),t.add(c.registerCommand(o)),t.add(c.registerCommand(n)),t.add(s.registerShortcut({priority:1e3,id:i.id,binding:E.ARROW_UP,preconditions:()=>!0,staticParameters:{direction:r.UP}})),t.add(s.registerShortcut({priority:1e3,id:o.id,binding:E.ARROW_DOWN,preconditions:()=>!0,staticParameters:{direction:r.DOWN}})),t.add(s.registerShortcut({priority:1e3,id:n.id,binding:E.ENTER,preconditions:()=>!0})),()=>{t.dispose()}},[c,l,s]),N(()=>{f(0)},[b]);let w=F(new Map);N(()=>()=>{w.current.clear()},[]);let te=b.length>0,T=(g==null?void 0:g.popup.Placeholder)||i.get(V.componentKey);return I(`div`,{className:`univer-mt-2`,children:te?I(Ie,{menus:b,focusedMenuIndex:u,focusedMenuRef:p,menuNodeMapRef:w,componentManager:i,onFocusedMenuIndexChange:f,onSelect:C}):T&&I(T,{})})};U.componentKey=`docs.quick.insert.popup`;function W(e){"@babel/helpers - typeof";return W=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},W(e)}function Be(e,t){if(W(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(W(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function Ve(e){var t=Be(e,`string`);return W(t)==`symbol`?t:t+``}function G(e,t,n){return(t=Ve(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function K(e,t){return function(n,r){t(n,r,e)}}function q(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}const He={dispose:()=>{}};let J=class extends i{get popups(){return Array.from(this._popups)}get editPopup(){return this._editPopup$.value}get isComposing(){return this._isComposing$.value}setIsComposing(e){this._isComposing$.next(e)}get inputOffset(){return this._inputOffset$.value}setInputOffset(e){this._inputOffset$.next(e)}getDocEventManagerService(e){var t;return(t=this._renderManagerService.getRenderById(e))==null?void 0:t.with(T)}constructor(e,t,n,r,i){super(),this._docCanvasPopupManagerService=e,this._univerInstanceService=t,this._commandService=n,this._renderManagerService=r,this._docSelectionManagerService=i,G(this,`_popups`,new Set),G(this,`_editPopup$`,new A(void 0)),G(this,`editPopup$`,this._editPopup$.asObservable()),G(this,`_isComposing$`,new A(!1)),G(this,`isComposing$`,this._isComposing$.asObservable()),G(this,`_inputOffset$`,new A({start:0,end:0})),G(this,`inputOffset$`,this._inputOffset$.asObservable()),G(this,`filterKeyword$`,void 0),G(this,`_menuSelectedCallbacks`,new Set),G(this,`_inputPlaceholderRenderRoot`,null),this.disposeWithMe(this._editPopup$);let a=(e,t)=>{var n;return(n=this._univerInstanceService.getCurrentUnitOfType(m.UNIVER_DOC))==null||(n=n.getBody())==null?void 0:n.dataStream.slice(e,t)},o=``;this.filterKeyword$=this._inputOffset$.pipe(ge(e=>{var t;let n=a(e.start,e.end);return(t=n==null?void 0:n.slice(1))==null?``:t}),he(),M(e=>{o=e})),this.disposeWithMe(j([this.filterKeyword$.pipe(M(e=>{if(e.length>0){var t;(t=this._inputPlaceholderRenderRoot)==null||(t=t.unmount)==null||t.dispose()}else{var n;(n=this._inputPlaceholderRenderRoot)==null||n.mount()}})),this.isComposing$.pipe(M(e=>{if(e){var t;(t=this._inputPlaceholderRenderRoot)==null||(t=t.unmount)==null||t.dispose()}else{var n;o.length<=0&&((n=this._inputPlaceholderRenderRoot)==null||n.mount())}})),this.editPopup$.pipe(M(e=>{if(!e){var t;(t=this._inputPlaceholderRenderRoot)==null||(t=t.unmount)==null||t.dispose(),this._inputPlaceholderRenderRoot=null}}))]).subscribe())}resolvePopup(e){return Array.from(this._popups).find(t=>t.keyword===e)}registerPopup(e){return this._popups.add(e),()=>{this._popups.delete(e)}}_createInputPlaceholderRenderRoot(e){return{isMounted:!1,mount(){if(this.isMounted)return;this.isMounted=!0;let t=e();this.unmount={dispose:()=>{t.dispose(),this.isMounted=!1}}}}}_getParagraphBound(e,t){var n,r;let i=this._univerInstanceService.getUnit(e),a=i==null||(n=i.getBody())==null||(n=n.paragraphs)==null?void 0:n.find(e=>e.startIndex>t);if(!a)return null;let o=this.getDocEventManagerService(e);return(r=o==null?void 0:o.findParagraphBoundByIndex(a.startIndex))==null?null:r}_getKeywordPlaceholderAnchorRect(e,t,n,r){let i=t.findNodePositionByCharIndex(n.startOffset,!0,n.segmentId,n.segmentPage);if(!i)return r;let a=e.getOffsetConfig(),{contentBoxPointGroup:o}=new oe(a,t).getRangePointData(i,i);if(o.length===0)return r;let s=ce(o),c=s.left+a.docsLeft,l=s.top+a.docsTop;return{left:c,right:c,top:l,bottom:l+s.height}}_getKeywordPlaceholderExtraProps(e){var t,n,r,i,a,o,s,c,l,u,d,f,p;return{fontSize:(t=e.ts)==null?void 0:t.fs,fontString:(n=e.fontStyle)==null?void 0:n.fontString,fontFamily:(r=(i=(a=e.fontStyle)==null?void 0:a.fontFamily)==null?(o=e.ts)==null?void 0:o.ff:i)==null?void 0:r,fontStyle:(s=e.ts)!=null&&s.it?`italic`:`normal`,fontWeight:(c=e.ts)!=null&&c.bl?`bold`:`normal`,ascent:(l=e.bBox)==null?void 0:l.ba,contentHeight:((u=(d=e.bBox)==null?void 0:d.ba)==null?0:u)+((f=(p=e.bBox)==null?void 0:p.bd)==null?0:f)||void 0}}_mountInputPlaceholder(e,t){let n=this._renderManagerService.getRenderById(e),r=n==null?void 0:n.with(y),i=this._docSelectionManagerService.getActiveTextRange();if(!n||!r||!i)return He;let a=r.getSkeleton(),o=a.findNodeByCharIndex(i.startOffset,i.segmentId,i.segmentPage);if((o==null?void 0:o.content)!==`\r`||!o)return He;let s=n.mainComponent,c=this._getKeywordPlaceholderAnchorRect(s,a,i,t),l=this._getKeywordPlaceholderExtraProps(o),u=this._docCanvasPopupManagerService.attachPopupToRect(c,{componentKey:z.componentKey,extraProps:l,onClickOutside:()=>{u.dispose()},direction:`horizontal`},e);return u}showPopup(e){let{popup:t,index:n,unitId:r}=e;this.closePopup();let i=this._getParagraphBound(r,n);if(!i)return;this._inputPlaceholderRenderRoot=this._createInputPlaceholderRenderRoot(()=>this._mountInputPlaceholder(r,i.firstLine)),this._inputPlaceholderRenderRoot.mount();let a=this._docCanvasPopupManagerService.attachPopupToRect(i.firstLine,{componentKey:U.componentKey,onClickOutside:()=>{this.closePopup()},direction:`bottom`},r);this._editPopup$.next({disposable:a,popup:t,anchor:n,unitId:r})}closePopup(){this.editPopup&&(this.editPopup.disposable.dispose(),this._editPopup$.next(null))}onMenuSelected(e){return this._menuSelectedCallbacks.add(e),()=>{this._menuSelectedCallbacks.delete(e)}}emitMenuSelected(e){let{start:t,end:n}=this.inputOffset;this._commandService.syncExecuteCommand(je.id,{start:t,end:n}),setTimeout(()=>{this._menuSelectedCallbacks.forEach(t=>t(e))},0)}};J=q([K(0,l(w)),K(1,l(c)),K(2,l(o)),K(3,l(k)),K(4,l(v))],J);const Ue={type:e.OPERATION,id:`doc.operation.show-quick-insert-popup`,handler(e,t){let n=e.get(J);return t?(n.showPopup(t),!0):!1}},Y={type:e.OPERATION,id:`doc.operation.close-quick-insert-popup`,handler(e){return e.get(J).closePopup(),!0}};let We=function(e){return e.Basic=`quick.insert.group.basic`,e.Media=`quick.insert.group.media`,e}({});const Ge={id:`quick-insert.text.menu`,title:`docQuickInsert.menu.text`,icon:`TextIcon`,keywords:[`text`]},Ke={id:se.id,title:`docQuickInsert.menu.numberedList`,icon:`OrderIcon`,keywords:[`numbered`,`list`,`ordered`]},qe={id:ee.id,title:`docQuickInsert.menu.bulletedList`,icon:`UnorderIcon`,keywords:[`bulleted`,`list`,`unordered`]},Je={id:ne.id,title:`docQuickInsert.menu.divider`,icon:`DividerIcon`,keywords:[`divider`,`line`,`separate`]},Ye={id:te.id,title:`docQuickInsert.menu.table`,icon:`GridIcon`,keywords:[`table`,`grid`,`spreadsheet`]},Xe={id:Ce.id,title:`docQuickInsert.menu.image`,icon:`AdditionAndSubtractionIcon`,keywords:[`image`,`picture`,`photo`]},Ze=[{title:`docQuickInsert.group.basics`,id:We.Basic,children:[Ge,Ke,qe,Je,Ye,Xe]}],Qe=new Set([Ke.id,qe.id,Je.id,Ye.id,Xe.id]);let X=class extends i{constructor(e,t,n,r,i){super(),this._commandService=e,this._textSelectionManagerService=t,this._docQuickInsertPopupService=n,this._shortcutService=r,this._univerInstanceService=i,this.disposeWithMe(this._shortcutService.registerShortcut({id:Y.id,binding:E.ESC,preconditions:()=>!!this._docQuickInsertPopupService.editPopup,priority:1e3})),this._initTrigger(),this._initMenuHandler()}_initTrigger(){this.disposeWithMe(this._commandService.onCommandExecuted(e=>{let{_docQuickInsertPopupService:n,_textSelectionManagerService:i,_commandService:a}=this,o=this._univerInstanceService.getCurrentUnitOfType(m.UNIVER_DOC);if(!(o!=null&&o.getDisabled())){if(e.id===ie.id){let t=e.params;if(n.editPopup){n.setInputOffset({start:n.inputOffset.start,end:t.range.endOffset+1});return}let r=i.getActiveTextRange();if(!r)return;let o=n.resolvePopup(t.body.dataStream);if(!o||!(!o.preconditions||o.preconditions(t)))return;n.setInputOffset({start:r.startOffset-1,end:r.startOffset}),setTimeout(()=>{a.executeCommand(Ue.id,{index:r.startOffset-1,unitId:t.unitId,popup:o})},100)}if(e.id===re.id){let t=e.params;!n.isComposing&&t.isCompositionStart&&n.setIsComposing(!0),n.isComposing&&t.isCompositionEnd&&n.setIsComposing(!1)}if(e.id===b.id){let t=e.params;if(t.isCompositionEnd){var s;let e=(s=t.textRanges)==null||(s=s[0])==null?void 0:s.endOffset;e&&n.setInputOffset({start:n.inputOffset.start,end:e})}}if(e.id===S.id){let r=e.params;if(n.editPopup&&r.direction===t.LEFT){var c;let e=(c=r.len)==null?0:c;n.setInputOffset({start:n.inputOffset.start,end:r.range.endOffset-e})}}if(e.id===ae.id){let t=e.params;(t.direction===r.LEFT||t.direction===r.RIGHT)&&n.editPopup&&a.executeCommand(Y.id)}if(e.id===C.id){let e=i.getActiveTextRange();if(!n.editPopup||!e)return;e.endOffset<=n.editPopup.anchor&&a.executeCommand(Y.id)}}}))}_initMenuHandler(){this.disposeWithMe(this._docQuickInsertPopupService.onMenuSelected(e=>{e.id!==Ge.id&&Qe.has(e.id)&&this._commandService.executeCommand(e.id)}))}};X=q([K(0,o),K(1,l(v)),K(2,l(J)),K(3,l(de)),K(4,l(c))],X);let Z=class extends i{get popup(){return this._popup$.value}constructor(e,t,n,r){super(),this._context=e,this._docEventManagerService=t,this._docQuickInsertPopupService=n,this._docCanvasPopManagerService=r,G(this,`_popup$`,new A(null)),G(this,`popup$`,this._popup$.asObservable()),this._init()}_init(){this.disposeWithMe(j([this._docEventManagerService.hoverParagraphLeftRealTime$,this._docEventManagerService.hoverParagraphRealTime$]).subscribe(([e,t])=>{let n=e==null?t:e,r=this._context.unit.getDisabled();if(!n||r){this._hideMenu(!0);return}if(n.paragraphStart===n.paragraphEnd){var i;if(this._docQuickInsertPopupService.editPopup||n.startIndex===((i=this.popup)==null?void 0:i.startIndex))return;this._hideMenu(!0);let e=this._docCanvasPopManagerService.attachPopupToRect(n.firstLine,{componentKey:$e,direction:`left-center`},this._context.unit.getUnitId());this._popup$.next({startIndex:n.startIndex,disposable:e})}else this._hideMenu(!0)}))}_hideMenu(e){this._docQuickInsertPopupService.editPopup||this.popup&&(e||this.popup.disposable.canDispose())&&(this.popup.disposable.dispose(),this._popup$.next(null))}};Z=q([K(1,l(T)),K(2,l(J)),K(3,l(w))],Z);const $e=`doc.quick-insert.button`,et=({className:e=``})=>{let t=D(J),n=D(c),r=D(k),i=O(P(()=>n.getCurrentTypeOfUnit$(m.UNIVER_DOC),[n])),a=i&&r.getRenderById(i.getUnitId()),o=a==null?void 0:a.with(Z),s=D(ue),l=D(v),u=O(t.editPopup$),d=pe(()=>{var e;let n=o==null?void 0:o.popup;if(!n)return;let r=t.popups,a={keyword:``,menus$:j(r.map(e=>e.menus$)).pipe(ge(e=>e.flat()))};l.replaceDocRanges([{startOffset:n.startIndex,endOffset:n.startIndex}]),t.setInputOffset({start:n.startIndex-1,end:n.startIndex-1}),t.showPopup({popup:a,index:n.startIndex-1,unitId:(e=i==null?void 0:i.getUnitId())==null?``:e}),setTimeout(()=>{s.focus()})});return I(`div`,{className:R(`univer-mr-1 univer-flex univer-cursor-pointer univer-items-center univer-gap-2.5 univer-rounded-full univer-p-1.5 univer-shadow-sm hover:univer-bg-gray-100 dark:!univer-text-gray-200 dark:hover:!univer-bg-gray-700`,xe,{"univer-bg-gray-100 dark:!univer-bg-gray-700":u,"univer-bg-white dark:!univer-bg-gray-900":!u},e),role:`button`,tabIndex:0,onClick:d,children:I(Ee,{className:`univer-text-gray-800 dark:!univer-text-gray-200`})})};et.componentKey=$e;let Q=class extends i{constructor(e,t,n){super(),this._commandService=e,this._docQuickInsertPopupService=t,this._componentManager=n,this._initCommands(),this._initComponents(),this._initMenus()}_initCommands(){[je,Ue,Y].forEach(e=>{this.disposeWithMe(this._commandService.registerCommand(e))})}_initComponents(){[[U.componentKey,U],[z.componentKey,z],[V.componentKey,V],[Te.displayName,Te],[De.displayName,De],[et.componentKey,et]].forEach(([e,t])=>{e&&this.disposeWithMe(this._componentManager.register(e,t))}),[{keyword:`/`,menus$:_e(Ze),preconditions:e=>{var t;return((t=e.range.startNodePosition)==null?void 0:t.glyph)===0}}].forEach(e=>{this.disposeWithMe(this._docQuickInsertPopupService.registerPopup(e))})}_initMenus(){}};Q=q([K(0,o),K(1,l(J)),K(2,l(le))],Q);var tt=`@univerjs/docs-quick-insert-ui`,nt=`0.20.1`;const rt=`docs-quick-insert-ui.config`;Symbol(rt);const it={};let $=class extends f{constructor(e=it,t,n,r){super(),this._config=e,this._injector=t,this._renderManagerSrv=n,this._configService=r;let{menu:i,...a}=g({},it,this._config);i&&this._configService.setConfig(`menu`,i,{merge:!0}),this._configService.setConfig(rt,a)}onStarting(){[[Q],[X],[J]].forEach(e=>this._injector.add(e)),this._injector.get(Q)}onRendered(){this._injector.get(X),this._injector.get(J),[[Z]].forEach(e=>{this._renderManagerSrv.registerRenderModule(m.UNIVER_DOC,e)})}};G($,`type`,m.UNIVER_DOC),G($,`pluginName`,`DOC_QUICK_INSERT_UI_PLUGIN`),G($,`packageName`,tt),G($,`version`,nt),$=q([n(Ae,ke,we,Oe,fe),K(1,l(u)),K(2,l(k)),K(3,s)],$);export{J as DocQuickInsertPopupService,X as DocQuickInsertTriggerController,Q as DocQuickInsertUIController,Me as KeywordInputPlaceholderComponentKey,Le as QuickInsertPlaceholderComponentKey,$ as UniverDocsQuickInsertUIPlugin};
|
|
1
|
+
import { CommandType, DeleteDirection, DependentOn, Direction, Disposable, DisposableCollection, ICommandService, IConfigService, IUniverInstanceService, Inject, Injector, LocaleService, Plugin, RANGE_DIRECTION, UniverInstanceType, generateRandomId, merge, toDisposable } from "@univerjs/core";
|
|
2
|
+
import { DocSelectionManagerService, DocSkeletonManagerService, RichTextEditingMutation } from "@univerjs/docs";
|
|
3
|
+
import { BulletListCommand, CutContentCommand, DeleteCommand, DeleteLeftCommand, DocCanvasPopManagerService, DocCreateTableOperation, DocEventManagerService, HorizontalLineCommand, IMEInputCommand, InsertCommand, MoveCursorOperation, NodePositionConvertToCursor, OrderListCommand, getAnchorBounding } from "@univerjs/docs-ui";
|
|
4
|
+
import { ComponentManager, ILayoutService, IShortcutService, KeyCode, UniverUIPlugin, useDependency, useEvent, useObservable } from "@univerjs/ui";
|
|
5
|
+
import { IRenderManagerService, ptToPixel } from "@univerjs/engine-render";
|
|
6
|
+
import { BehaviorSubject, combineLatest, distinctUntilChanged, map, of, tap } from "rxjs";
|
|
7
|
+
import { useEffect, useMemo, useRef, useState } from "react";
|
|
8
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
|
+
import { Tooltip, borderBottomClassName, borderClassName, clsx, scrollbarClassName } from "@univerjs/design";
|
|
10
|
+
import { InsertDocImageCommand, UniverDocsDrawingUIPlugin } from "@univerjs/docs-drawing-ui";
|
|
11
|
+
import { DividerIcon, IncreaseIcon, TextIcon } from "@univerjs/icons";
|
|
12
|
+
import { UniverDocsDrawingPlugin } from "@univerjs/docs-drawing";
|
|
13
|
+
import { UniverDrawingPlugin } from "@univerjs/drawing";
|
|
14
|
+
import { UniverDrawingUIPlugin } from "@univerjs/drawing-ui";
|
|
15
|
+
|
|
16
|
+
//#region src/commands/commands/doc-quick-insert.command.ts
|
|
17
|
+
const DeleteSearchKeyCommand = {
|
|
18
|
+
id: "doc.command.delete-search-key",
|
|
19
|
+
type: CommandType.COMMAND,
|
|
20
|
+
handler: (accessor, params) => {
|
|
21
|
+
const commandService = accessor.get(ICommandService);
|
|
22
|
+
const { start, end } = params;
|
|
23
|
+
return commandService.syncExecuteCommand(CutContentCommand.id, {
|
|
24
|
+
segmentId: "",
|
|
25
|
+
textRanges: [{
|
|
26
|
+
startOffset: start,
|
|
27
|
+
endOffset: start,
|
|
28
|
+
collapsed: true
|
|
29
|
+
}],
|
|
30
|
+
selections: [{
|
|
31
|
+
startOffset: start,
|
|
32
|
+
endOffset: end,
|
|
33
|
+
collapsed: false,
|
|
34
|
+
direction: RANGE_DIRECTION.FORWARD
|
|
35
|
+
}]
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
//#endregion
|
|
41
|
+
//#region src/views/KeywordInputPlaceholder.tsx
|
|
42
|
+
const KeywordInputPlaceholderComponentKey = "docs.quick.insert.keyword-input-placeholder";
|
|
43
|
+
const DEFAULT_FONT_SIZE = 11;
|
|
44
|
+
function measureTextWidth(text, font) {
|
|
45
|
+
if (typeof document === "undefined") return text.length * DEFAULT_FONT_SIZE;
|
|
46
|
+
const context = document.createElement("canvas").getContext("2d");
|
|
47
|
+
if (!context) return text.length * DEFAULT_FONT_SIZE;
|
|
48
|
+
context.font = font;
|
|
49
|
+
return Math.ceil(context.measureText(text).width);
|
|
50
|
+
}
|
|
51
|
+
const KeywordInputPlaceholder = ({ popup }) => {
|
|
52
|
+
var _popup$extraProps$fon, _popup$extraProps, _popup$extraProps$fon2, _popup$extraProps2, _popup$extraProps$asc, _popup$extraProps3, _popup$extraProps$con, _popup$extraProps4, _popup$extraProps5, _popup$extraProps6, _popup$extraProps7;
|
|
53
|
+
const placeholder = useDependency(LocaleService).t("docQuickInsert.keywordInputPlaceholder");
|
|
54
|
+
const fontSizePx = ptToPixel((_popup$extraProps$fon = (_popup$extraProps = popup.extraProps) === null || _popup$extraProps === void 0 ? void 0 : _popup$extraProps.fontSize) !== null && _popup$extraProps$fon !== void 0 ? _popup$extraProps$fon : DEFAULT_FONT_SIZE);
|
|
55
|
+
const fontString = (_popup$extraProps$fon2 = (_popup$extraProps2 = popup.extraProps) === null || _popup$extraProps2 === void 0 ? void 0 : _popup$extraProps2.fontString) !== null && _popup$extraProps$fon2 !== void 0 ? _popup$extraProps$fon2 : `${fontSizePx}px sans-serif`;
|
|
56
|
+
const ascent = (_popup$extraProps$asc = (_popup$extraProps3 = popup.extraProps) === null || _popup$extraProps3 === void 0 ? void 0 : _popup$extraProps3.ascent) !== null && _popup$extraProps$asc !== void 0 ? _popup$extraProps$asc : fontSizePx;
|
|
57
|
+
const contentHeight = Math.max((_popup$extraProps$con = (_popup$extraProps4 = popup.extraProps) === null || _popup$extraProps4 === void 0 ? void 0 : _popup$extraProps4.contentHeight) !== null && _popup$extraProps$con !== void 0 ? _popup$extraProps$con : fontSizePx, fontSizePx);
|
|
58
|
+
const textWidth = useMemo(() => measureTextWidth(placeholder, fontString), [fontString, placeholder]);
|
|
59
|
+
return /* @__PURE__ */ jsx("div", {
|
|
60
|
+
className: "univer-select-none univer-font-normal univer-text-gray-500 univer-transition-colors dark:!univer-text-gray-400",
|
|
61
|
+
children: /* @__PURE__ */ jsx("svg", {
|
|
62
|
+
width: textWidth,
|
|
63
|
+
height: contentHeight,
|
|
64
|
+
viewBox: `0 0 ${textWidth} ${contentHeight}`,
|
|
65
|
+
style: {
|
|
66
|
+
overflow: "visible",
|
|
67
|
+
display: "block"
|
|
68
|
+
},
|
|
69
|
+
children: /* @__PURE__ */ jsx("text", {
|
|
70
|
+
x: 0,
|
|
71
|
+
y: ascent,
|
|
72
|
+
fill: "currentColor",
|
|
73
|
+
style: {
|
|
74
|
+
font: fontString,
|
|
75
|
+
fontFamily: (_popup$extraProps5 = popup.extraProps) === null || _popup$extraProps5 === void 0 ? void 0 : _popup$extraProps5.fontFamily,
|
|
76
|
+
fontStyle: (_popup$extraProps6 = popup.extraProps) === null || _popup$extraProps6 === void 0 ? void 0 : _popup$extraProps6.fontStyle,
|
|
77
|
+
fontWeight: (_popup$extraProps7 = popup.extraProps) === null || _popup$extraProps7 === void 0 ? void 0 : _popup$extraProps7.fontWeight
|
|
78
|
+
},
|
|
79
|
+
children: placeholder
|
|
80
|
+
})
|
|
81
|
+
})
|
|
82
|
+
});
|
|
83
|
+
};
|
|
84
|
+
KeywordInputPlaceholder.componentKey = KeywordInputPlaceholderComponentKey;
|
|
85
|
+
|
|
86
|
+
//#endregion
|
|
87
|
+
//#region src/views/QuickInsertMenu.tsx
|
|
88
|
+
function isMenuGroup(menu) {
|
|
89
|
+
return "children" in menu;
|
|
90
|
+
}
|
|
91
|
+
function flattenMenuItems(menus) {
|
|
92
|
+
return menus.flatMap((menu) => {
|
|
93
|
+
if (isMenuGroup(menu)) return flattenMenuItems(menu.children);
|
|
94
|
+
return menu;
|
|
95
|
+
});
|
|
96
|
+
}
|
|
97
|
+
function getQuickInsertMenuLeafCount(menus) {
|
|
98
|
+
return flattenMenuItems(menus).length;
|
|
99
|
+
}
|
|
100
|
+
function QuickInsertMenu(props) {
|
|
101
|
+
const { menus, focusedMenuIndex, focusedMenuRef, menuNodeMapRef, componentManager, onFocusedMenuIndexChange, onSelect } = props;
|
|
102
|
+
const flatMenus = useMemo(() => flattenMenuItems(menus), [menus]);
|
|
103
|
+
useEffect(() => {
|
|
104
|
+
var _flatMenus$focusedMen, _menuNodeMapRef$curre;
|
|
105
|
+
const focusedMenu = Number.isNaN(focusedMenuIndex) ? null : (_flatMenus$focusedMen = flatMenus[focusedMenuIndex]) !== null && _flatMenus$focusedMen !== void 0 ? _flatMenus$focusedMen : null;
|
|
106
|
+
focusedMenuRef.current = focusedMenu;
|
|
107
|
+
if (!focusedMenu) return;
|
|
108
|
+
(_menuNodeMapRef$curre = menuNodeMapRef.current.get(focusedMenu.id)) === null || _menuNodeMapRef$curre === void 0 || _menuNodeMapRef$curre.scrollIntoView({ block: "nearest" });
|
|
109
|
+
}, [
|
|
110
|
+
flatMenus,
|
|
111
|
+
focusedMenuIndex,
|
|
112
|
+
focusedMenuRef,
|
|
113
|
+
menuNodeMapRef
|
|
114
|
+
]);
|
|
115
|
+
const itemIndexRef = useRef(0);
|
|
116
|
+
itemIndexRef.current = 0;
|
|
117
|
+
function renderMenus(currentMenus) {
|
|
118
|
+
return currentMenus.map((menu, index) => {
|
|
119
|
+
const iconKey = menu.icon;
|
|
120
|
+
const Icon = iconKey ? componentManager.get(iconKey) : null;
|
|
121
|
+
if (isMenuGroup(menu)) return /* @__PURE__ */ jsxs("div", {
|
|
122
|
+
className: clsx("univer-grid univer-gap-1 univer-py-1", index !== currentMenus.length - 1 && borderBottomClassName),
|
|
123
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
124
|
+
className: "univer-box-border univer-inline-flex univer-items-center univer-gap-2 univer-px-2 univer-text-xs univer-font-semibold univer-text-gray-600 dark:!univer-text-gray-300",
|
|
125
|
+
children: [Icon && /* @__PURE__ */ jsx("span", {
|
|
126
|
+
className: "univer-inline-flex univer-text-base",
|
|
127
|
+
children: /* @__PURE__ */ jsx(Icon, {})
|
|
128
|
+
}), /* @__PURE__ */ jsx("span", { children: menu.title })]
|
|
129
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
130
|
+
className: "univer-grid univer-gap-1",
|
|
131
|
+
children: renderMenus(menu.children)
|
|
132
|
+
})]
|
|
133
|
+
}, menu.id);
|
|
134
|
+
const currentMenuIndex = itemIndexRef.current;
|
|
135
|
+
const isFocused = focusedMenuIndex === currentMenuIndex;
|
|
136
|
+
itemIndexRef.current += 1;
|
|
137
|
+
return /* @__PURE__ */ jsx("div", {
|
|
138
|
+
ref: (node) => {
|
|
139
|
+
if (node) {
|
|
140
|
+
menuNodeMapRef.current.set(menu.id, node);
|
|
141
|
+
return;
|
|
142
|
+
}
|
|
143
|
+
menuNodeMapRef.current.delete(menu.id);
|
|
144
|
+
},
|
|
145
|
+
role: "button",
|
|
146
|
+
tabIndex: -1,
|
|
147
|
+
className: clsx("univer-relative univer-box-border univer-flex univer-min-h-8 univer-w-full univer-cursor-pointer univer-items-center univer-justify-between univer-gap-3 univer-rounded-md univer-border-none univer-bg-transparent univer-px-2 univer-text-left univer-text-sm univer-text-gray-900 univer-outline-none hover:univer-bg-gray-50 dark:!univer-text-white dark:hover:!univer-bg-gray-600", {
|
|
148
|
+
"hover:univer-bg-transparent": !isFocused,
|
|
149
|
+
"univer-bg-gray-50 dark:!univer-bg-gray-600": isFocused
|
|
150
|
+
}),
|
|
151
|
+
onMouseEnter: () => onFocusedMenuIndexChange(currentMenuIndex),
|
|
152
|
+
onMouseLeave: () => onFocusedMenuIndexChange(NaN),
|
|
153
|
+
onClick: () => onSelect(menu),
|
|
154
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
155
|
+
className: "univer-inline-flex univer-w-full univer-items-center univer-gap-2",
|
|
156
|
+
children: [Icon && /* @__PURE__ */ jsx("span", {
|
|
157
|
+
className: "univer-inline-flex univer-text-base",
|
|
158
|
+
children: /* @__PURE__ */ jsx(Icon, {})
|
|
159
|
+
}), /* @__PURE__ */ jsx(Tooltip, {
|
|
160
|
+
showIfEllipsis: true,
|
|
161
|
+
title: menu.title,
|
|
162
|
+
placement: "right",
|
|
163
|
+
children: /* @__PURE__ */ jsx("span", {
|
|
164
|
+
className: "univer-truncate",
|
|
165
|
+
children: menu.title
|
|
166
|
+
})
|
|
167
|
+
})]
|
|
168
|
+
})
|
|
169
|
+
}, menu.id);
|
|
170
|
+
});
|
|
171
|
+
}
|
|
172
|
+
return /* @__PURE__ */ jsx("div", {
|
|
173
|
+
className: clsx("univer-box-border univer-grid univer-max-h-[360px] univer-gap-1 univer-overflow-y-auto univer-overflow-x-hidden univer-overscroll-contain univer-rounded-md univer-bg-white univer-px-2 univer-py-1 univer-text-sm univer-text-gray-900 univer-shadow-md dark:!univer-bg-gray-700 dark:!univer-text-white", borderClassName, scrollbarClassName),
|
|
174
|
+
onWheel: (event) => event.stopPropagation(),
|
|
175
|
+
children: renderMenus(menus)
|
|
176
|
+
});
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
//#endregion
|
|
180
|
+
//#region src/views/QuickInsertPlaceholder.tsx
|
|
181
|
+
/**
|
|
182
|
+
* Copyright 2023-present DreamNum Co., Ltd.
|
|
183
|
+
*
|
|
184
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
185
|
+
* you may not use this file except in compliance with the License.
|
|
186
|
+
* You may obtain a copy of the License at
|
|
187
|
+
*
|
|
188
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
189
|
+
*
|
|
190
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
191
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
192
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
193
|
+
* See the License for the specific language governing permissions and
|
|
194
|
+
* limitations under the License.
|
|
195
|
+
*/
|
|
196
|
+
const QuickInsertPlaceholderComponentKey = "docs.quick.insert.placeholder";
|
|
197
|
+
const QuickInsertPlaceholder = () => {
|
|
198
|
+
return /* @__PURE__ */ jsx("div", {
|
|
199
|
+
className: "univer-flex univer-h-full univer-items-center univer-justify-center univer-rounded-lg univer-bg-white univer-px-12 univer-py-6 univer-text-gray-400 univer-shadow-lg",
|
|
200
|
+
children: /* @__PURE__ */ jsx("span", { children: useDependency(LocaleService).t("docQuickInsert.placeholder") })
|
|
201
|
+
});
|
|
202
|
+
};
|
|
203
|
+
QuickInsertPlaceholder.componentKey = QuickInsertPlaceholderComponentKey;
|
|
204
|
+
|
|
205
|
+
//#endregion
|
|
206
|
+
//#region src/views/QuickInsertPopup.tsx
|
|
207
|
+
function filterMenusByKeyword(menus, keyword) {
|
|
208
|
+
return menus.map((menu) => ({ ...menu })).filter((menu) => {
|
|
209
|
+
if ("children" in menu) {
|
|
210
|
+
menu.children = filterMenusByKeyword(menu.children, keyword);
|
|
211
|
+
return menu.children.length > 0;
|
|
212
|
+
}
|
|
213
|
+
const keywords = menu.keywords;
|
|
214
|
+
if (keywords) return keywords.some((word) => word.includes(keyword));
|
|
215
|
+
return menu.title.toLowerCase().includes(keyword);
|
|
216
|
+
});
|
|
217
|
+
}
|
|
218
|
+
function translateMenus(menus, localeService) {
|
|
219
|
+
return menus.map((_menu) => {
|
|
220
|
+
const menu = { ..._menu };
|
|
221
|
+
if ("children" in menu) menu.children = translateMenus(menu.children, localeService);
|
|
222
|
+
menu.title = localeService.t(menu.title);
|
|
223
|
+
if ("keywords" in menu) menu.keywords = menu.keywords.concat(menu.title).map((word) => word.toLowerCase());
|
|
224
|
+
return menu;
|
|
225
|
+
});
|
|
226
|
+
}
|
|
227
|
+
const interceptKeys = [
|
|
228
|
+
KeyCode.ARROW_UP,
|
|
229
|
+
KeyCode.ARROW_DOWN,
|
|
230
|
+
KeyCode.ENTER
|
|
231
|
+
];
|
|
232
|
+
const QuickInsertPopup = () => {
|
|
233
|
+
const localeService = useDependency(LocaleService);
|
|
234
|
+
const docQuickInsertPopupService = useDependency(DocQuickInsertPopupService);
|
|
235
|
+
const componentManager = useDependency(ComponentManager);
|
|
236
|
+
const shortcutService = useDependency(IShortcutService);
|
|
237
|
+
const commandService = useDependency(ICommandService);
|
|
238
|
+
const id = useMemo(() => generateRandomId(), []);
|
|
239
|
+
const [focusedMenuIndex, setFocusedMenuIndex] = useState(0);
|
|
240
|
+
const focusedMenuRef = useRef(null);
|
|
241
|
+
const filterKeyword = useObservable(docQuickInsertPopupService.filterKeyword$, "");
|
|
242
|
+
const currentPopup = useObservable(docQuickInsertPopupService.editPopup$);
|
|
243
|
+
const menus = useObservable(currentPopup === null || currentPopup === void 0 ? void 0 : currentPopup.popup.menus$, []);
|
|
244
|
+
const translatedMenus = useMemo(() => {
|
|
245
|
+
return translateMenus(menus, localeService);
|
|
246
|
+
}, [menus]);
|
|
247
|
+
const [filteredMenus, setFilteredMenus] = useState(() => {
|
|
248
|
+
return filterMenusByKeyword(translatedMenus, filterKeyword.toLowerCase());
|
|
249
|
+
});
|
|
250
|
+
const filteredMenuCount = useMemo(() => getQuickInsertMenuLeafCount(filteredMenus), [filteredMenus]);
|
|
251
|
+
const filteredMenuCountRef = useRef(filteredMenuCount);
|
|
252
|
+
useEffect(() => {
|
|
253
|
+
filteredMenuCountRef.current = filteredMenuCount;
|
|
254
|
+
}, [filteredMenuCount]);
|
|
255
|
+
useEffect(() => {
|
|
256
|
+
const id = requestIdleCallback(() => {
|
|
257
|
+
setFilteredMenus(filterMenusByKeyword(translatedMenus, filterKeyword.toLowerCase()));
|
|
258
|
+
});
|
|
259
|
+
return () => {
|
|
260
|
+
cancelIdleCallback(id);
|
|
261
|
+
};
|
|
262
|
+
}, [translatedMenus, filterKeyword]);
|
|
263
|
+
const handleMenuSelect = (menu) => {
|
|
264
|
+
docQuickInsertPopupService.emitMenuSelected(menu);
|
|
265
|
+
commandService.executeCommand(CloseQuickInsertPopupOperation.id);
|
|
266
|
+
};
|
|
267
|
+
useEffect(() => {
|
|
268
|
+
/** Use up or down to navigate the focused menu instead of moving the cursor in documents. */
|
|
269
|
+
const disposableCollection = new DisposableCollection();
|
|
270
|
+
shortcutService.getAllShortcuts().filter((item) => item.binding && interceptKeys.includes(item.binding)).forEach((item) => {
|
|
271
|
+
const rawPreconditions = item.preconditions;
|
|
272
|
+
item.preconditions = () => false;
|
|
273
|
+
disposableCollection.add(toDisposable(() => {
|
|
274
|
+
item.preconditions = rawPreconditions;
|
|
275
|
+
}));
|
|
276
|
+
});
|
|
277
|
+
const enterCommand = {
|
|
278
|
+
id: `quick.insert.popup.enter.${id}`,
|
|
279
|
+
type: CommandType.OPERATION,
|
|
280
|
+
handler: () => {
|
|
281
|
+
const menu = focusedMenuRef.current;
|
|
282
|
+
if (menu) handleMenuSelect(menu);
|
|
283
|
+
}
|
|
284
|
+
};
|
|
285
|
+
const moveCursorUpCommand = {
|
|
286
|
+
id: `quick.insert.popup.move.cursor.up.${id}`,
|
|
287
|
+
type: CommandType.OPERATION,
|
|
288
|
+
handler: () => {
|
|
289
|
+
setFocusedMenuIndex((index) => {
|
|
290
|
+
if (filteredMenuCountRef.current <= 0) return 0;
|
|
291
|
+
const nextIndex = index - 1;
|
|
292
|
+
return nextIndex >= 0 ? nextIndex : filteredMenuCountRef.current - 1;
|
|
293
|
+
});
|
|
294
|
+
}
|
|
295
|
+
};
|
|
296
|
+
const moveCursorDownCommand = {
|
|
297
|
+
id: `quick.insert.popup.move.cursor.down.${id}`,
|
|
298
|
+
type: CommandType.OPERATION,
|
|
299
|
+
handler: () => {
|
|
300
|
+
setFocusedMenuIndex((index) => {
|
|
301
|
+
if (filteredMenuCountRef.current <= 0) return 0;
|
|
302
|
+
const nextIndex = index + 1;
|
|
303
|
+
return nextIndex <= filteredMenuCountRef.current - 1 ? nextIndex : 0;
|
|
304
|
+
});
|
|
305
|
+
}
|
|
306
|
+
};
|
|
307
|
+
disposableCollection.add(commandService.registerCommand(moveCursorUpCommand));
|
|
308
|
+
disposableCollection.add(commandService.registerCommand(moveCursorDownCommand));
|
|
309
|
+
disposableCollection.add(commandService.registerCommand(enterCommand));
|
|
310
|
+
disposableCollection.add(shortcutService.registerShortcut({
|
|
311
|
+
priority: 1e3,
|
|
312
|
+
id: moveCursorUpCommand.id,
|
|
313
|
+
binding: KeyCode.ARROW_UP,
|
|
314
|
+
preconditions: () => true,
|
|
315
|
+
staticParameters: { direction: Direction.UP }
|
|
316
|
+
}));
|
|
317
|
+
disposableCollection.add(shortcutService.registerShortcut({
|
|
318
|
+
priority: 1e3,
|
|
319
|
+
id: moveCursorDownCommand.id,
|
|
320
|
+
binding: KeyCode.ARROW_DOWN,
|
|
321
|
+
preconditions: () => true,
|
|
322
|
+
staticParameters: { direction: Direction.DOWN }
|
|
323
|
+
}));
|
|
324
|
+
disposableCollection.add(shortcutService.registerShortcut({
|
|
325
|
+
priority: 1e3,
|
|
326
|
+
id: enterCommand.id,
|
|
327
|
+
binding: KeyCode.ENTER,
|
|
328
|
+
preconditions: () => true
|
|
329
|
+
}));
|
|
330
|
+
return () => {
|
|
331
|
+
disposableCollection.dispose();
|
|
332
|
+
};
|
|
333
|
+
}, [
|
|
334
|
+
commandService,
|
|
335
|
+
id,
|
|
336
|
+
shortcutService
|
|
337
|
+
]);
|
|
338
|
+
useEffect(() => {
|
|
339
|
+
setFocusedMenuIndex(0);
|
|
340
|
+
}, [filteredMenus]);
|
|
341
|
+
const menuNodeMapRef = useRef(/* @__PURE__ */ new Map());
|
|
342
|
+
useEffect(() => {
|
|
343
|
+
return () => {
|
|
344
|
+
menuNodeMapRef.current.clear();
|
|
345
|
+
};
|
|
346
|
+
}, []);
|
|
347
|
+
const hasMenus = filteredMenus.length > 0;
|
|
348
|
+
const Placeholder = (currentPopup === null || currentPopup === void 0 ? void 0 : currentPopup.popup.Placeholder) || componentManager.get(QuickInsertPlaceholder.componentKey);
|
|
349
|
+
return /* @__PURE__ */ jsx("div", {
|
|
350
|
+
className: "univer-mt-2",
|
|
351
|
+
children: hasMenus ? /* @__PURE__ */ jsx(QuickInsertMenu, {
|
|
352
|
+
menus: filteredMenus,
|
|
353
|
+
focusedMenuIndex,
|
|
354
|
+
focusedMenuRef,
|
|
355
|
+
menuNodeMapRef,
|
|
356
|
+
componentManager,
|
|
357
|
+
onFocusedMenuIndexChange: setFocusedMenuIndex,
|
|
358
|
+
onSelect: handleMenuSelect
|
|
359
|
+
}) : Placeholder && /* @__PURE__ */ jsx(Placeholder, {})
|
|
360
|
+
});
|
|
361
|
+
};
|
|
362
|
+
QuickInsertPopup.componentKey = "docs.quick.insert.popup";
|
|
363
|
+
|
|
364
|
+
//#endregion
|
|
365
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/typeof.js
|
|
366
|
+
function _typeof(o) {
|
|
367
|
+
"@babel/helpers - typeof";
|
|
368
|
+
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
|
|
369
|
+
return typeof o;
|
|
370
|
+
} : function(o) {
|
|
371
|
+
return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
|
|
372
|
+
}, _typeof(o);
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
//#endregion
|
|
376
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/toPrimitive.js
|
|
377
|
+
function toPrimitive(t, r) {
|
|
378
|
+
if ("object" != _typeof(t) || !t) return t;
|
|
379
|
+
var e = t[Symbol.toPrimitive];
|
|
380
|
+
if (void 0 !== e) {
|
|
381
|
+
var i = e.call(t, r || "default");
|
|
382
|
+
if ("object" != _typeof(i)) return i;
|
|
383
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
384
|
+
}
|
|
385
|
+
return ("string" === r ? String : Number)(t);
|
|
386
|
+
}
|
|
387
|
+
|
|
388
|
+
//#endregion
|
|
389
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/toPropertyKey.js
|
|
390
|
+
function toPropertyKey(t) {
|
|
391
|
+
var i = toPrimitive(t, "string");
|
|
392
|
+
return "symbol" == _typeof(i) ? i : i + "";
|
|
393
|
+
}
|
|
394
|
+
|
|
395
|
+
//#endregion
|
|
396
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/defineProperty.js
|
|
397
|
+
function _defineProperty(e, r, t) {
|
|
398
|
+
return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
399
|
+
value: t,
|
|
400
|
+
enumerable: !0,
|
|
401
|
+
configurable: !0,
|
|
402
|
+
writable: !0
|
|
403
|
+
}) : e[r] = t, e;
|
|
404
|
+
}
|
|
405
|
+
|
|
406
|
+
//#endregion
|
|
407
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/decorateParam.js
|
|
408
|
+
function __decorateParam(paramIndex, decorator) {
|
|
409
|
+
return function(target, key) {
|
|
410
|
+
decorator(target, key, paramIndex);
|
|
411
|
+
};
|
|
412
|
+
}
|
|
413
|
+
|
|
414
|
+
//#endregion
|
|
415
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/decorate.js
|
|
416
|
+
function __decorate(decorators, target, key, desc) {
|
|
417
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
418
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
419
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
420
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
421
|
+
}
|
|
422
|
+
|
|
423
|
+
//#endregion
|
|
424
|
+
//#region src/services/doc-quick-insert-popup.service.ts
|
|
425
|
+
const noopDisposable = { dispose: () => {} };
|
|
426
|
+
let DocQuickInsertPopupService = class DocQuickInsertPopupService extends Disposable {
|
|
427
|
+
get popups() {
|
|
428
|
+
return Array.from(this._popups);
|
|
429
|
+
}
|
|
430
|
+
get editPopup() {
|
|
431
|
+
return this._editPopup$.value;
|
|
432
|
+
}
|
|
433
|
+
get isComposing() {
|
|
434
|
+
return this._isComposing$.value;
|
|
435
|
+
}
|
|
436
|
+
setIsComposing(isComposing) {
|
|
437
|
+
this._isComposing$.next(isComposing);
|
|
438
|
+
}
|
|
439
|
+
get inputOffset() {
|
|
440
|
+
return this._inputOffset$.value;
|
|
441
|
+
}
|
|
442
|
+
setInputOffset(offset) {
|
|
443
|
+
this._inputOffset$.next(offset);
|
|
444
|
+
}
|
|
445
|
+
getDocEventManagerService(unitId) {
|
|
446
|
+
var _this$_renderManagerS;
|
|
447
|
+
return (_this$_renderManagerS = this._renderManagerService.getRenderById(unitId)) === null || _this$_renderManagerS === void 0 ? void 0 : _this$_renderManagerS.with(DocEventManagerService);
|
|
448
|
+
}
|
|
449
|
+
constructor(_docCanvasPopupManagerService, _univerInstanceService, _commandService, _renderManagerService, _docSelectionManagerService) {
|
|
450
|
+
super();
|
|
451
|
+
this._docCanvasPopupManagerService = _docCanvasPopupManagerService;
|
|
452
|
+
this._univerInstanceService = _univerInstanceService;
|
|
453
|
+
this._commandService = _commandService;
|
|
454
|
+
this._renderManagerService = _renderManagerService;
|
|
455
|
+
this._docSelectionManagerService = _docSelectionManagerService;
|
|
456
|
+
_defineProperty(this, "_popups", /* @__PURE__ */ new Set());
|
|
457
|
+
_defineProperty(this, "_editPopup$", new BehaviorSubject(void 0));
|
|
458
|
+
_defineProperty(this, "editPopup$", this._editPopup$.asObservable());
|
|
459
|
+
_defineProperty(this, "_isComposing$", new BehaviorSubject(false));
|
|
460
|
+
_defineProperty(this, "isComposing$", this._isComposing$.asObservable());
|
|
461
|
+
_defineProperty(this, "_inputOffset$", new BehaviorSubject({
|
|
462
|
+
start: 0,
|
|
463
|
+
end: 0
|
|
464
|
+
}));
|
|
465
|
+
_defineProperty(this, "inputOffset$", this._inputOffset$.asObservable());
|
|
466
|
+
_defineProperty(this, "filterKeyword$", void 0);
|
|
467
|
+
_defineProperty(this, "_menuSelectedCallbacks", /* @__PURE__ */ new Set());
|
|
468
|
+
_defineProperty(this, "_inputPlaceholderRenderRoot", null);
|
|
469
|
+
this.disposeWithMe(this._editPopup$);
|
|
470
|
+
const getBodySlice = (start, end) => {
|
|
471
|
+
var _this$_univerInstance;
|
|
472
|
+
return (_this$_univerInstance = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_DOC)) === null || _this$_univerInstance === void 0 || (_this$_univerInstance = _this$_univerInstance.getBody()) === null || _this$_univerInstance === void 0 ? void 0 : _this$_univerInstance.dataStream.slice(start, end);
|
|
473
|
+
};
|
|
474
|
+
let lastFilterKeyword = "";
|
|
475
|
+
this.filterKeyword$ = this._inputOffset$.pipe(map((offset) => {
|
|
476
|
+
var _slice$slice;
|
|
477
|
+
const slice = getBodySlice(offset.start, offset.end);
|
|
478
|
+
return (_slice$slice = slice === null || slice === void 0 ? void 0 : slice.slice(1)) !== null && _slice$slice !== void 0 ? _slice$slice : "";
|
|
479
|
+
}), distinctUntilChanged(), tap((filterKeyword) => {
|
|
480
|
+
lastFilterKeyword = filterKeyword;
|
|
481
|
+
}));
|
|
482
|
+
this.disposeWithMe(combineLatest([
|
|
483
|
+
this.filterKeyword$.pipe(tap((filterKeyword) => {
|
|
484
|
+
if (filterKeyword.length > 0) {
|
|
485
|
+
var _this$_inputPlacehold;
|
|
486
|
+
(_this$_inputPlacehold = this._inputPlaceholderRenderRoot) === null || _this$_inputPlacehold === void 0 || (_this$_inputPlacehold = _this$_inputPlacehold.unmount) === null || _this$_inputPlacehold === void 0 || _this$_inputPlacehold.dispose();
|
|
487
|
+
} else {
|
|
488
|
+
var _this$_inputPlacehold2;
|
|
489
|
+
(_this$_inputPlacehold2 = this._inputPlaceholderRenderRoot) === null || _this$_inputPlacehold2 === void 0 || _this$_inputPlacehold2.mount();
|
|
490
|
+
}
|
|
491
|
+
})),
|
|
492
|
+
this.isComposing$.pipe(tap((isComposing) => {
|
|
493
|
+
if (isComposing) {
|
|
494
|
+
var _this$_inputPlacehold3;
|
|
495
|
+
(_this$_inputPlacehold3 = this._inputPlaceholderRenderRoot) === null || _this$_inputPlacehold3 === void 0 || (_this$_inputPlacehold3 = _this$_inputPlacehold3.unmount) === null || _this$_inputPlacehold3 === void 0 || _this$_inputPlacehold3.dispose();
|
|
496
|
+
} else {
|
|
497
|
+
var _this$_inputPlacehold4;
|
|
498
|
+
lastFilterKeyword.length <= 0 && ((_this$_inputPlacehold4 = this._inputPlaceholderRenderRoot) === null || _this$_inputPlacehold4 === void 0 || _this$_inputPlacehold4.mount());
|
|
499
|
+
}
|
|
500
|
+
})),
|
|
501
|
+
this.editPopup$.pipe(tap((popup) => {
|
|
502
|
+
if (!popup) {
|
|
503
|
+
var _this$_inputPlacehold5;
|
|
504
|
+
(_this$_inputPlacehold5 = this._inputPlaceholderRenderRoot) === null || _this$_inputPlacehold5 === void 0 || (_this$_inputPlacehold5 = _this$_inputPlacehold5.unmount) === null || _this$_inputPlacehold5 === void 0 || _this$_inputPlacehold5.dispose();
|
|
505
|
+
this._inputPlaceholderRenderRoot = null;
|
|
506
|
+
}
|
|
507
|
+
}))
|
|
508
|
+
]).subscribe());
|
|
509
|
+
}
|
|
510
|
+
resolvePopup(keyword) {
|
|
511
|
+
return Array.from(this._popups).find((popup) => popup.keyword === keyword);
|
|
512
|
+
}
|
|
513
|
+
registerPopup(popup) {
|
|
514
|
+
this._popups.add(popup);
|
|
515
|
+
return () => {
|
|
516
|
+
this._popups.delete(popup);
|
|
517
|
+
};
|
|
518
|
+
}
|
|
519
|
+
_createInputPlaceholderRenderRoot(mount) {
|
|
520
|
+
return {
|
|
521
|
+
isMounted: false,
|
|
522
|
+
mount() {
|
|
523
|
+
if (this.isMounted) return;
|
|
524
|
+
this.isMounted = true;
|
|
525
|
+
const unmount = mount();
|
|
526
|
+
this.unmount = { dispose: () => {
|
|
527
|
+
unmount.dispose();
|
|
528
|
+
this.isMounted = false;
|
|
529
|
+
} };
|
|
530
|
+
}
|
|
531
|
+
};
|
|
532
|
+
}
|
|
533
|
+
_getParagraphBound(unitId, index) {
|
|
534
|
+
var _currentDoc$getBody, _docEventManagerServi;
|
|
535
|
+
const currentDoc = this._univerInstanceService.getUnit(unitId);
|
|
536
|
+
const paragraph = currentDoc === null || currentDoc === void 0 || (_currentDoc$getBody = currentDoc.getBody()) === null || _currentDoc$getBody === void 0 || (_currentDoc$getBody = _currentDoc$getBody.paragraphs) === null || _currentDoc$getBody === void 0 ? void 0 : _currentDoc$getBody.find((p) => p.startIndex > index);
|
|
537
|
+
if (!paragraph) return null;
|
|
538
|
+
const docEventManagerService = this.getDocEventManagerService(unitId);
|
|
539
|
+
return (_docEventManagerServi = docEventManagerService === null || docEventManagerService === void 0 ? void 0 : docEventManagerService.findParagraphBoundByIndex(paragraph.startIndex)) !== null && _docEventManagerServi !== void 0 ? _docEventManagerServi : null;
|
|
540
|
+
}
|
|
541
|
+
_getKeywordPlaceholderAnchorRect(document, skeleton, activeRange, fallbackRect) {
|
|
542
|
+
const startPosition = skeleton.findNodePositionByCharIndex(activeRange.startOffset, true, activeRange.segmentId, activeRange.segmentPage);
|
|
543
|
+
if (!startPosition) return fallbackRect;
|
|
544
|
+
const documentOffsetConfig = document.getOffsetConfig();
|
|
545
|
+
const { contentBoxPointGroup } = new NodePositionConvertToCursor(documentOffsetConfig, skeleton).getRangePointData(startPosition, startPosition);
|
|
546
|
+
if (contentBoxPointGroup.length === 0) return fallbackRect;
|
|
547
|
+
const anchor = getAnchorBounding(contentBoxPointGroup);
|
|
548
|
+
const left = anchor.left + documentOffsetConfig.docsLeft;
|
|
549
|
+
const top = anchor.top + documentOffsetConfig.docsTop;
|
|
550
|
+
return {
|
|
551
|
+
left,
|
|
552
|
+
right: left,
|
|
553
|
+
top,
|
|
554
|
+
bottom: top + anchor.height
|
|
555
|
+
};
|
|
556
|
+
}
|
|
557
|
+
_getKeywordPlaceholderExtraProps(curGlyph) {
|
|
558
|
+
var _curGlyph$ts, _curGlyph$fontStyle, _ref, _curGlyph$fontStyle$f, _curGlyph$fontStyle2, _curGlyph$ts2, _curGlyph$ts3, _curGlyph$ts4, _curGlyph$bBox, _curGlyph$bBox$ba, _curGlyph$bBox2, _curGlyph$bBox$bd, _curGlyph$bBox3;
|
|
559
|
+
return {
|
|
560
|
+
fontSize: (_curGlyph$ts = curGlyph.ts) === null || _curGlyph$ts === void 0 ? void 0 : _curGlyph$ts.fs,
|
|
561
|
+
fontString: (_curGlyph$fontStyle = curGlyph.fontStyle) === null || _curGlyph$fontStyle === void 0 ? void 0 : _curGlyph$fontStyle.fontString,
|
|
562
|
+
fontFamily: (_ref = (_curGlyph$fontStyle$f = (_curGlyph$fontStyle2 = curGlyph.fontStyle) === null || _curGlyph$fontStyle2 === void 0 ? void 0 : _curGlyph$fontStyle2.fontFamily) !== null && _curGlyph$fontStyle$f !== void 0 ? _curGlyph$fontStyle$f : (_curGlyph$ts2 = curGlyph.ts) === null || _curGlyph$ts2 === void 0 ? void 0 : _curGlyph$ts2.ff) !== null && _ref !== void 0 ? _ref : void 0,
|
|
563
|
+
fontStyle: ((_curGlyph$ts3 = curGlyph.ts) === null || _curGlyph$ts3 === void 0 ? void 0 : _curGlyph$ts3.it) ? "italic" : "normal",
|
|
564
|
+
fontWeight: ((_curGlyph$ts4 = curGlyph.ts) === null || _curGlyph$ts4 === void 0 ? void 0 : _curGlyph$ts4.bl) ? "bold" : "normal",
|
|
565
|
+
ascent: (_curGlyph$bBox = curGlyph.bBox) === null || _curGlyph$bBox === void 0 ? void 0 : _curGlyph$bBox.ba,
|
|
566
|
+
contentHeight: ((_curGlyph$bBox$ba = (_curGlyph$bBox2 = curGlyph.bBox) === null || _curGlyph$bBox2 === void 0 ? void 0 : _curGlyph$bBox2.ba) !== null && _curGlyph$bBox$ba !== void 0 ? _curGlyph$bBox$ba : 0) + ((_curGlyph$bBox$bd = (_curGlyph$bBox3 = curGlyph.bBox) === null || _curGlyph$bBox3 === void 0 ? void 0 : _curGlyph$bBox3.bd) !== null && _curGlyph$bBox$bd !== void 0 ? _curGlyph$bBox$bd : 0) || void 0
|
|
567
|
+
};
|
|
568
|
+
}
|
|
569
|
+
_mountInputPlaceholder(unitId, fallbackRect) {
|
|
570
|
+
const currentRender = this._renderManagerService.getRenderById(unitId);
|
|
571
|
+
const docSkeletonManagerService = currentRender === null || currentRender === void 0 ? void 0 : currentRender.with(DocSkeletonManagerService);
|
|
572
|
+
const activeRange = this._docSelectionManagerService.getActiveTextRange();
|
|
573
|
+
if (!currentRender || !docSkeletonManagerService || !activeRange) return noopDisposable;
|
|
574
|
+
const skeleton = docSkeletonManagerService.getSkeleton();
|
|
575
|
+
const curGlyph = skeleton.findNodeByCharIndex(activeRange.startOffset, activeRange.segmentId, activeRange.segmentPage);
|
|
576
|
+
if (!((curGlyph === null || curGlyph === void 0 ? void 0 : curGlyph.content) === "\r") || !curGlyph) return noopDisposable;
|
|
577
|
+
const document = currentRender.mainComponent;
|
|
578
|
+
const placeholderAnchorRect = this._getKeywordPlaceholderAnchorRect(document, skeleton, activeRange, fallbackRect);
|
|
579
|
+
const extraProps = this._getKeywordPlaceholderExtraProps(curGlyph);
|
|
580
|
+
const disposable = this._docCanvasPopupManagerService.attachPopupToRect(placeholderAnchorRect, {
|
|
581
|
+
componentKey: KeywordInputPlaceholder.componentKey,
|
|
582
|
+
extraProps,
|
|
583
|
+
onClickOutside: () => {
|
|
584
|
+
disposable.dispose();
|
|
585
|
+
},
|
|
586
|
+
direction: "horizontal"
|
|
587
|
+
}, unitId);
|
|
588
|
+
return disposable;
|
|
589
|
+
}
|
|
590
|
+
showPopup(options) {
|
|
591
|
+
const { popup, index, unitId } = options;
|
|
592
|
+
this.closePopup();
|
|
593
|
+
const paragraphBound = this._getParagraphBound(unitId, index);
|
|
594
|
+
if (!paragraphBound) return;
|
|
595
|
+
this._inputPlaceholderRenderRoot = this._createInputPlaceholderRenderRoot(() => this._mountInputPlaceholder(unitId, paragraphBound.firstLine));
|
|
596
|
+
this._inputPlaceholderRenderRoot.mount();
|
|
597
|
+
const disposable = this._docCanvasPopupManagerService.attachPopupToRect(paragraphBound.firstLine, {
|
|
598
|
+
componentKey: QuickInsertPopup.componentKey,
|
|
599
|
+
onClickOutside: () => {
|
|
600
|
+
this.closePopup();
|
|
601
|
+
},
|
|
602
|
+
direction: "bottom"
|
|
603
|
+
}, unitId);
|
|
604
|
+
this._editPopup$.next({
|
|
605
|
+
disposable,
|
|
606
|
+
popup,
|
|
607
|
+
anchor: index,
|
|
608
|
+
unitId
|
|
609
|
+
});
|
|
610
|
+
}
|
|
611
|
+
closePopup() {
|
|
612
|
+
if (this.editPopup) {
|
|
613
|
+
this.editPopup.disposable.dispose();
|
|
614
|
+
this._editPopup$.next(null);
|
|
615
|
+
}
|
|
616
|
+
}
|
|
617
|
+
onMenuSelected(callback) {
|
|
618
|
+
this._menuSelectedCallbacks.add(callback);
|
|
619
|
+
return () => {
|
|
620
|
+
this._menuSelectedCallbacks.delete(callback);
|
|
621
|
+
};
|
|
622
|
+
}
|
|
623
|
+
emitMenuSelected(menu) {
|
|
624
|
+
const { start, end } = this.inputOffset;
|
|
625
|
+
this._commandService.syncExecuteCommand(DeleteSearchKeyCommand.id, {
|
|
626
|
+
start,
|
|
627
|
+
end
|
|
628
|
+
});
|
|
629
|
+
setTimeout(() => {
|
|
630
|
+
this._menuSelectedCallbacks.forEach((callback) => callback(menu));
|
|
631
|
+
}, 0);
|
|
632
|
+
}
|
|
633
|
+
};
|
|
634
|
+
DocQuickInsertPopupService = __decorate([
|
|
635
|
+
__decorateParam(0, Inject(DocCanvasPopManagerService)),
|
|
636
|
+
__decorateParam(1, Inject(IUniverInstanceService)),
|
|
637
|
+
__decorateParam(2, Inject(ICommandService)),
|
|
638
|
+
__decorateParam(3, Inject(IRenderManagerService)),
|
|
639
|
+
__decorateParam(4, Inject(DocSelectionManagerService))
|
|
640
|
+
], DocQuickInsertPopupService);
|
|
641
|
+
|
|
642
|
+
//#endregion
|
|
643
|
+
//#region src/commands/operations/quick-insert-popup.operation.ts
|
|
644
|
+
const ShowQuickInsertPopupOperation = {
|
|
645
|
+
type: CommandType.OPERATION,
|
|
646
|
+
id: "doc.operation.show-quick-insert-popup",
|
|
647
|
+
handler(accessor, params) {
|
|
648
|
+
const docQuickInsertPopupService = accessor.get(DocQuickInsertPopupService);
|
|
649
|
+
if (!params) return false;
|
|
650
|
+
docQuickInsertPopupService.showPopup(params);
|
|
651
|
+
return true;
|
|
652
|
+
}
|
|
653
|
+
};
|
|
654
|
+
const CloseQuickInsertPopupOperation = {
|
|
655
|
+
type: CommandType.OPERATION,
|
|
656
|
+
id: "doc.operation.close-quick-insert-popup",
|
|
657
|
+
handler(accessor) {
|
|
658
|
+
accessor.get(DocQuickInsertPopupService).closePopup();
|
|
659
|
+
return true;
|
|
660
|
+
}
|
|
661
|
+
};
|
|
662
|
+
|
|
663
|
+
//#endregion
|
|
664
|
+
//#region src/menu/menu.ts
|
|
665
|
+
let QuickInsertMenuGroup = /* @__PURE__ */ function(QuickInsertMenuGroup) {
|
|
666
|
+
QuickInsertMenuGroup["Basic"] = "quick.insert.group.basic";
|
|
667
|
+
QuickInsertMenuGroup["Media"] = "quick.insert.group.media";
|
|
668
|
+
return QuickInsertMenuGroup;
|
|
669
|
+
}({});
|
|
670
|
+
const textMenu = {
|
|
671
|
+
id: "quick-insert.text.menu",
|
|
672
|
+
title: "docQuickInsert.menu.text",
|
|
673
|
+
icon: "TextIcon",
|
|
674
|
+
keywords: ["text"]
|
|
675
|
+
};
|
|
676
|
+
const numberedListMenu = {
|
|
677
|
+
id: OrderListCommand.id,
|
|
678
|
+
title: "docQuickInsert.menu.numberedList",
|
|
679
|
+
icon: "OrderIcon",
|
|
680
|
+
keywords: [
|
|
681
|
+
"numbered",
|
|
682
|
+
"list",
|
|
683
|
+
"ordered"
|
|
684
|
+
]
|
|
685
|
+
};
|
|
686
|
+
const bulletedListMenu = {
|
|
687
|
+
id: BulletListCommand.id,
|
|
688
|
+
title: "docQuickInsert.menu.bulletedList",
|
|
689
|
+
icon: "UnorderIcon",
|
|
690
|
+
keywords: [
|
|
691
|
+
"bulleted",
|
|
692
|
+
"list",
|
|
693
|
+
"unordered"
|
|
694
|
+
]
|
|
695
|
+
};
|
|
696
|
+
const dividerMenu = {
|
|
697
|
+
id: HorizontalLineCommand.id,
|
|
698
|
+
title: "docQuickInsert.menu.divider",
|
|
699
|
+
icon: "DividerIcon",
|
|
700
|
+
keywords: [
|
|
701
|
+
"divider",
|
|
702
|
+
"line",
|
|
703
|
+
"separate"
|
|
704
|
+
]
|
|
705
|
+
};
|
|
706
|
+
const tableMenu = {
|
|
707
|
+
id: DocCreateTableOperation.id,
|
|
708
|
+
title: "docQuickInsert.menu.table",
|
|
709
|
+
icon: "GridIcon",
|
|
710
|
+
keywords: [
|
|
711
|
+
"table",
|
|
712
|
+
"grid",
|
|
713
|
+
"spreadsheet"
|
|
714
|
+
]
|
|
715
|
+
};
|
|
716
|
+
const imageMenu = {
|
|
717
|
+
id: InsertDocImageCommand.id,
|
|
718
|
+
title: "docQuickInsert.menu.image",
|
|
719
|
+
icon: "AdditionAndSubtractionIcon",
|
|
720
|
+
keywords: [
|
|
721
|
+
"image",
|
|
722
|
+
"picture",
|
|
723
|
+
"photo"
|
|
724
|
+
]
|
|
725
|
+
};
|
|
726
|
+
const builtInMenus = [{
|
|
727
|
+
title: "docQuickInsert.group.basics",
|
|
728
|
+
id: QuickInsertMenuGroup.Basic,
|
|
729
|
+
children: [
|
|
730
|
+
textMenu,
|
|
731
|
+
numberedListMenu,
|
|
732
|
+
bulletedListMenu,
|
|
733
|
+
dividerMenu,
|
|
734
|
+
tableMenu,
|
|
735
|
+
imageMenu
|
|
736
|
+
]
|
|
737
|
+
}];
|
|
738
|
+
const builtInMenuCommandIds = new Set([
|
|
739
|
+
numberedListMenu.id,
|
|
740
|
+
bulletedListMenu.id,
|
|
741
|
+
dividerMenu.id,
|
|
742
|
+
tableMenu.id,
|
|
743
|
+
imageMenu.id
|
|
744
|
+
]);
|
|
745
|
+
|
|
746
|
+
//#endregion
|
|
747
|
+
//#region src/controllers/doc-quick-insert-trigger.controller.ts
|
|
748
|
+
let DocQuickInsertTriggerController = class DocQuickInsertTriggerController extends Disposable {
|
|
749
|
+
constructor(_commandService, _textSelectionManagerService, _docQuickInsertPopupService, _shortcutService, _univerInstanceService) {
|
|
750
|
+
super();
|
|
751
|
+
this._commandService = _commandService;
|
|
752
|
+
this._textSelectionManagerService = _textSelectionManagerService;
|
|
753
|
+
this._docQuickInsertPopupService = _docQuickInsertPopupService;
|
|
754
|
+
this._shortcutService = _shortcutService;
|
|
755
|
+
this._univerInstanceService = _univerInstanceService;
|
|
756
|
+
this.disposeWithMe(this._shortcutService.registerShortcut({
|
|
757
|
+
id: CloseQuickInsertPopupOperation.id,
|
|
758
|
+
binding: KeyCode.ESC,
|
|
759
|
+
preconditions: () => Boolean(this._docQuickInsertPopupService.editPopup),
|
|
760
|
+
priority: 1e3
|
|
761
|
+
}));
|
|
762
|
+
this._initTrigger();
|
|
763
|
+
this._initMenuHandler();
|
|
764
|
+
}
|
|
765
|
+
_initTrigger() {
|
|
766
|
+
this.disposeWithMe(this._commandService.onCommandExecuted((commandInfo) => {
|
|
767
|
+
const { _docQuickInsertPopupService, _textSelectionManagerService, _commandService } = this;
|
|
768
|
+
const documentDataModel = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_DOC);
|
|
769
|
+
if (documentDataModel === null || documentDataModel === void 0 ? void 0 : documentDataModel.getDisabled()) return;
|
|
770
|
+
if (commandInfo.id === InsertCommand.id) {
|
|
771
|
+
const params = commandInfo.params;
|
|
772
|
+
if (_docQuickInsertPopupService.editPopup) {
|
|
773
|
+
_docQuickInsertPopupService.setInputOffset({
|
|
774
|
+
start: _docQuickInsertPopupService.inputOffset.start,
|
|
775
|
+
end: params.range.endOffset + 1
|
|
776
|
+
});
|
|
777
|
+
return;
|
|
778
|
+
}
|
|
779
|
+
const activeRange = _textSelectionManagerService.getActiveTextRange();
|
|
780
|
+
if (!activeRange) return;
|
|
781
|
+
const popup = _docQuickInsertPopupService.resolvePopup(params.body.dataStream);
|
|
782
|
+
if (!popup) return;
|
|
783
|
+
if (!(popup.preconditions ? popup.preconditions(params) : true)) return;
|
|
784
|
+
_docQuickInsertPopupService.setInputOffset({
|
|
785
|
+
start: activeRange.startOffset - 1,
|
|
786
|
+
end: activeRange.startOffset
|
|
787
|
+
});
|
|
788
|
+
setTimeout(() => {
|
|
789
|
+
_commandService.executeCommand(ShowQuickInsertPopupOperation.id, {
|
|
790
|
+
index: activeRange.startOffset - 1,
|
|
791
|
+
unitId: params.unitId,
|
|
792
|
+
popup
|
|
793
|
+
});
|
|
794
|
+
}, 100);
|
|
795
|
+
}
|
|
796
|
+
if (commandInfo.id === IMEInputCommand.id) {
|
|
797
|
+
const params = commandInfo.params;
|
|
798
|
+
if (!_docQuickInsertPopupService.isComposing && params.isCompositionStart) _docQuickInsertPopupService.setIsComposing(true);
|
|
799
|
+
if (_docQuickInsertPopupService.isComposing && params.isCompositionEnd) _docQuickInsertPopupService.setIsComposing(false);
|
|
800
|
+
}
|
|
801
|
+
if (commandInfo.id === RichTextEditingMutation.id) {
|
|
802
|
+
const params = commandInfo.params;
|
|
803
|
+
if (params.isCompositionEnd) {
|
|
804
|
+
var _params$textRanges;
|
|
805
|
+
const endOffset = (_params$textRanges = params.textRanges) === null || _params$textRanges === void 0 || (_params$textRanges = _params$textRanges[0]) === null || _params$textRanges === void 0 ? void 0 : _params$textRanges.endOffset;
|
|
806
|
+
if (endOffset) _docQuickInsertPopupService.setInputOffset({
|
|
807
|
+
start: _docQuickInsertPopupService.inputOffset.start,
|
|
808
|
+
end: endOffset
|
|
809
|
+
});
|
|
810
|
+
}
|
|
811
|
+
}
|
|
812
|
+
if (commandInfo.id === DeleteCommand.id) {
|
|
813
|
+
const params = commandInfo.params;
|
|
814
|
+
if (_docQuickInsertPopupService.editPopup && params.direction === DeleteDirection.LEFT) {
|
|
815
|
+
var _params$len;
|
|
816
|
+
const len = (_params$len = params.len) !== null && _params$len !== void 0 ? _params$len : 0;
|
|
817
|
+
_docQuickInsertPopupService.setInputOffset({
|
|
818
|
+
start: _docQuickInsertPopupService.inputOffset.start,
|
|
819
|
+
end: params.range.endOffset - len
|
|
820
|
+
});
|
|
821
|
+
}
|
|
822
|
+
}
|
|
823
|
+
if (commandInfo.id === MoveCursorOperation.id) {
|
|
824
|
+
const params = commandInfo.params;
|
|
825
|
+
if (params.direction === Direction.LEFT || params.direction === Direction.RIGHT) _docQuickInsertPopupService.editPopup && _commandService.executeCommand(CloseQuickInsertPopupOperation.id);
|
|
826
|
+
}
|
|
827
|
+
if (commandInfo.id === DeleteLeftCommand.id) {
|
|
828
|
+
const activeRange = _textSelectionManagerService.getActiveTextRange();
|
|
829
|
+
if (!_docQuickInsertPopupService.editPopup || !activeRange) return;
|
|
830
|
+
if (activeRange.endOffset <= _docQuickInsertPopupService.editPopup.anchor) _commandService.executeCommand(CloseQuickInsertPopupOperation.id);
|
|
831
|
+
}
|
|
832
|
+
}));
|
|
833
|
+
}
|
|
834
|
+
_initMenuHandler() {
|
|
835
|
+
this.disposeWithMe(this._docQuickInsertPopupService.onMenuSelected((menu) => {
|
|
836
|
+
if (menu.id === textMenu.id) return;
|
|
837
|
+
if (builtInMenuCommandIds.has(menu.id)) this._commandService.executeCommand(menu.id);
|
|
838
|
+
}));
|
|
839
|
+
}
|
|
840
|
+
};
|
|
841
|
+
DocQuickInsertTriggerController = __decorate([
|
|
842
|
+
__decorateParam(0, ICommandService),
|
|
843
|
+
__decorateParam(1, Inject(DocSelectionManagerService)),
|
|
844
|
+
__decorateParam(2, Inject(DocQuickInsertPopupService)),
|
|
845
|
+
__decorateParam(3, Inject(IShortcutService)),
|
|
846
|
+
__decorateParam(4, Inject(IUniverInstanceService))
|
|
847
|
+
], DocQuickInsertTriggerController);
|
|
848
|
+
|
|
849
|
+
//#endregion
|
|
850
|
+
//#region src/menu/doc-quick-insert-menu.controller.ts
|
|
851
|
+
let DocQuickInsertMenuController = class DocQuickInsertMenuController extends Disposable {
|
|
852
|
+
get popup() {
|
|
853
|
+
return this._popup$.value;
|
|
854
|
+
}
|
|
855
|
+
constructor(_context, _docEventManagerService, _docQuickInsertPopupService, _docCanvasPopManagerService) {
|
|
856
|
+
super();
|
|
857
|
+
this._context = _context;
|
|
858
|
+
this._docEventManagerService = _docEventManagerService;
|
|
859
|
+
this._docQuickInsertPopupService = _docQuickInsertPopupService;
|
|
860
|
+
this._docCanvasPopManagerService = _docCanvasPopManagerService;
|
|
861
|
+
_defineProperty(this, "_popup$", new BehaviorSubject(null));
|
|
862
|
+
_defineProperty(this, "popup$", this._popup$.asObservable());
|
|
863
|
+
this._init();
|
|
864
|
+
}
|
|
865
|
+
_init() {
|
|
866
|
+
this.disposeWithMe(combineLatest([this._docEventManagerService.hoverParagraphLeftRealTime$, this._docEventManagerService.hoverParagraphRealTime$]).subscribe(([left, paragraph]) => {
|
|
867
|
+
const p = left !== null && left !== void 0 ? left : paragraph;
|
|
868
|
+
const isDisabled = this._context.unit.getDisabled();
|
|
869
|
+
if (!p || isDisabled) {
|
|
870
|
+
this._hideMenu(true);
|
|
871
|
+
return;
|
|
872
|
+
}
|
|
873
|
+
if (p.paragraphStart === p.paragraphEnd) {
|
|
874
|
+
var _this$popup;
|
|
875
|
+
if (this._docQuickInsertPopupService.editPopup || p.startIndex === ((_this$popup = this.popup) === null || _this$popup === void 0 ? void 0 : _this$popup.startIndex)) return;
|
|
876
|
+
this._hideMenu(true);
|
|
877
|
+
const disposable = this._docCanvasPopManagerService.attachPopupToRect(p.firstLine, {
|
|
878
|
+
componentKey: QuickInsertButtonComponentKey,
|
|
879
|
+
direction: "left-center"
|
|
880
|
+
}, this._context.unit.getUnitId());
|
|
881
|
+
this._popup$.next({
|
|
882
|
+
startIndex: p.startIndex,
|
|
883
|
+
disposable
|
|
884
|
+
});
|
|
885
|
+
} else this._hideMenu(true);
|
|
886
|
+
}));
|
|
887
|
+
}
|
|
888
|
+
_hideMenu(force) {
|
|
889
|
+
if (this._docQuickInsertPopupService.editPopup) return;
|
|
890
|
+
if (this.popup && (force || this.popup.disposable.canDispose())) {
|
|
891
|
+
this.popup.disposable.dispose();
|
|
892
|
+
this._popup$.next(null);
|
|
893
|
+
}
|
|
894
|
+
}
|
|
895
|
+
};
|
|
896
|
+
DocQuickInsertMenuController = __decorate([
|
|
897
|
+
__decorateParam(1, Inject(DocEventManagerService)),
|
|
898
|
+
__decorateParam(2, Inject(DocQuickInsertPopupService)),
|
|
899
|
+
__decorateParam(3, Inject(DocCanvasPopManagerService))
|
|
900
|
+
], DocQuickInsertMenuController);
|
|
901
|
+
|
|
902
|
+
//#endregion
|
|
903
|
+
//#region src/views/QuickInsertButton.tsx
|
|
904
|
+
const QuickInsertButtonComponentKey = "doc.quick-insert.button";
|
|
905
|
+
const QuickInsertButton = ({ className = "" }) => {
|
|
906
|
+
const docQuickInsertPopupService = useDependency(DocQuickInsertPopupService);
|
|
907
|
+
const univerInstanceService = useDependency(IUniverInstanceService);
|
|
908
|
+
const renderManagerService = useDependency(IRenderManagerService);
|
|
909
|
+
const currentDoc = useObservable(useMemo(() => univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_DOC), [univerInstanceService]));
|
|
910
|
+
const currentUnit = currentDoc && renderManagerService.getRenderById(currentDoc.getUnitId());
|
|
911
|
+
const docQuickInsertMenuController = currentUnit === null || currentUnit === void 0 ? void 0 : currentUnit.with(DocQuickInsertMenuController);
|
|
912
|
+
const layoutService = useDependency(ILayoutService);
|
|
913
|
+
const docSelectionManagerService = useDependency(DocSelectionManagerService);
|
|
914
|
+
const editPopup = useObservable(docQuickInsertPopupService.editPopup$);
|
|
915
|
+
const onClick = useEvent(() => {
|
|
916
|
+
var _currentDoc$getUnitId;
|
|
917
|
+
const p = docQuickInsertMenuController === null || docQuickInsertMenuController === void 0 ? void 0 : docQuickInsertMenuController.popup;
|
|
918
|
+
if (!p) return;
|
|
919
|
+
const allPopups = docQuickInsertPopupService.popups;
|
|
920
|
+
const popup = {
|
|
921
|
+
keyword: "",
|
|
922
|
+
menus$: combineLatest(allPopups.map((p) => p.menus$)).pipe(map((menusCollection) => menusCollection.flat()))
|
|
923
|
+
};
|
|
924
|
+
docSelectionManagerService.replaceDocRanges([{
|
|
925
|
+
startOffset: p.startIndex,
|
|
926
|
+
endOffset: p.startIndex
|
|
927
|
+
}]);
|
|
928
|
+
docQuickInsertPopupService.setInputOffset({
|
|
929
|
+
start: p.startIndex - 1,
|
|
930
|
+
end: p.startIndex - 1
|
|
931
|
+
});
|
|
932
|
+
docQuickInsertPopupService.showPopup({
|
|
933
|
+
popup,
|
|
934
|
+
index: p.startIndex - 1,
|
|
935
|
+
unitId: (_currentDoc$getUnitId = currentDoc === null || currentDoc === void 0 ? void 0 : currentDoc.getUnitId()) !== null && _currentDoc$getUnitId !== void 0 ? _currentDoc$getUnitId : ""
|
|
936
|
+
});
|
|
937
|
+
setTimeout(() => {
|
|
938
|
+
layoutService.focus();
|
|
939
|
+
});
|
|
940
|
+
});
|
|
941
|
+
return /* @__PURE__ */ jsx("div", {
|
|
942
|
+
className: clsx("univer-mr-1 univer-flex univer-cursor-pointer univer-items-center univer-gap-2.5 univer-rounded-full univer-p-1.5 univer-shadow-sm hover:univer-bg-gray-100 dark:!univer-text-gray-200 dark:hover:!univer-bg-gray-700", borderClassName, {
|
|
943
|
+
"univer-bg-gray-100 dark:!univer-bg-gray-700": editPopup,
|
|
944
|
+
"univer-bg-white dark:!univer-bg-gray-900": !editPopup
|
|
945
|
+
}, className),
|
|
946
|
+
role: "button",
|
|
947
|
+
tabIndex: 0,
|
|
948
|
+
onClick,
|
|
949
|
+
children: /* @__PURE__ */ jsx(IncreaseIcon, { className: "univer-text-gray-800 dark:!univer-text-gray-200" })
|
|
950
|
+
});
|
|
951
|
+
};
|
|
952
|
+
QuickInsertButton.componentKey = QuickInsertButtonComponentKey;
|
|
953
|
+
|
|
954
|
+
//#endregion
|
|
955
|
+
//#region src/controllers/doc-quick-insert-ui.controller.ts
|
|
956
|
+
let DocQuickInsertUIController = class DocQuickInsertUIController extends Disposable {
|
|
957
|
+
constructor(_commandService, _docQuickInsertPopupService, _componentManager) {
|
|
958
|
+
super();
|
|
959
|
+
this._commandService = _commandService;
|
|
960
|
+
this._docQuickInsertPopupService = _docQuickInsertPopupService;
|
|
961
|
+
this._componentManager = _componentManager;
|
|
962
|
+
this._initCommands();
|
|
963
|
+
this._initComponents();
|
|
964
|
+
this._initMenus();
|
|
965
|
+
}
|
|
966
|
+
_initCommands() {
|
|
967
|
+
[
|
|
968
|
+
DeleteSearchKeyCommand,
|
|
969
|
+
ShowQuickInsertPopupOperation,
|
|
970
|
+
CloseQuickInsertPopupOperation
|
|
971
|
+
].forEach((operation) => {
|
|
972
|
+
this.disposeWithMe(this._commandService.registerCommand(operation));
|
|
973
|
+
});
|
|
974
|
+
}
|
|
975
|
+
_initComponents() {
|
|
976
|
+
[
|
|
977
|
+
[QuickInsertPopup.componentKey, QuickInsertPopup],
|
|
978
|
+
[KeywordInputPlaceholder.componentKey, KeywordInputPlaceholder],
|
|
979
|
+
[QuickInsertPlaceholder.componentKey, QuickInsertPlaceholder],
|
|
980
|
+
[DividerIcon.displayName, DividerIcon],
|
|
981
|
+
[TextIcon.displayName, TextIcon],
|
|
982
|
+
[QuickInsertButton.componentKey, QuickInsertButton]
|
|
983
|
+
].forEach(([key, comp]) => {
|
|
984
|
+
if (key) this.disposeWithMe(this._componentManager.register(key, comp));
|
|
985
|
+
});
|
|
986
|
+
[{
|
|
987
|
+
keyword: "/",
|
|
988
|
+
menus$: of(builtInMenus),
|
|
989
|
+
preconditions: (params) => {
|
|
990
|
+
var _startNodePosition;
|
|
991
|
+
return ((_startNodePosition = params.range.startNodePosition) === null || _startNodePosition === void 0 ? void 0 : _startNodePosition.glyph) === 0;
|
|
992
|
+
}
|
|
993
|
+
}].forEach((popup) => {
|
|
994
|
+
this.disposeWithMe(this._docQuickInsertPopupService.registerPopup(popup));
|
|
995
|
+
});
|
|
996
|
+
}
|
|
997
|
+
_initMenus() {}
|
|
998
|
+
};
|
|
999
|
+
DocQuickInsertUIController = __decorate([
|
|
1000
|
+
__decorateParam(0, ICommandService),
|
|
1001
|
+
__decorateParam(1, Inject(DocQuickInsertPopupService)),
|
|
1002
|
+
__decorateParam(2, Inject(ComponentManager))
|
|
1003
|
+
], DocQuickInsertUIController);
|
|
1004
|
+
|
|
1005
|
+
//#endregion
|
|
1006
|
+
//#region package.json
|
|
1007
|
+
var name = "@univerjs/docs-quick-insert-ui";
|
|
1008
|
+
var version = "0.21.0-insiders.20260422-d7fcb4d";
|
|
1009
|
+
|
|
1010
|
+
//#endregion
|
|
1011
|
+
//#region src/config/config.ts
|
|
1012
|
+
const DOCS_QUICK_INSERT_UI_PLUGIN_CONFIG_KEY = "docs-quick-insert-ui.config";
|
|
1013
|
+
const configSymbol = Symbol(DOCS_QUICK_INSERT_UI_PLUGIN_CONFIG_KEY);
|
|
1014
|
+
const defaultPluginConfig = {};
|
|
1015
|
+
|
|
1016
|
+
//#endregion
|
|
1017
|
+
//#region src/plugin.ts
|
|
1018
|
+
let UniverDocsQuickInsertUIPlugin = class UniverDocsQuickInsertUIPlugin extends Plugin {
|
|
1019
|
+
constructor(_config = defaultPluginConfig, _injector, _renderManagerSrv, _configService) {
|
|
1020
|
+
super();
|
|
1021
|
+
this._config = _config;
|
|
1022
|
+
this._injector = _injector;
|
|
1023
|
+
this._renderManagerSrv = _renderManagerSrv;
|
|
1024
|
+
this._configService = _configService;
|
|
1025
|
+
const { menu, ...rest } = merge({}, defaultPluginConfig, this._config);
|
|
1026
|
+
if (menu) this._configService.setConfig("menu", menu, { merge: true });
|
|
1027
|
+
this._configService.setConfig(DOCS_QUICK_INSERT_UI_PLUGIN_CONFIG_KEY, rest);
|
|
1028
|
+
}
|
|
1029
|
+
onStarting() {
|
|
1030
|
+
[
|
|
1031
|
+
[DocQuickInsertUIController],
|
|
1032
|
+
[DocQuickInsertTriggerController],
|
|
1033
|
+
[DocQuickInsertPopupService]
|
|
1034
|
+
].forEach((dependency) => this._injector.add(dependency));
|
|
1035
|
+
this._injector.get(DocQuickInsertUIController);
|
|
1036
|
+
}
|
|
1037
|
+
onRendered() {
|
|
1038
|
+
this._injector.get(DocQuickInsertTriggerController);
|
|
1039
|
+
this._injector.get(DocQuickInsertPopupService);
|
|
1040
|
+
[[DocQuickInsertMenuController]].forEach((m) => {
|
|
1041
|
+
this._renderManagerSrv.registerRenderModule(UniverInstanceType.UNIVER_DOC, m);
|
|
1042
|
+
});
|
|
1043
|
+
}
|
|
1044
|
+
};
|
|
1045
|
+
_defineProperty(UniverDocsQuickInsertUIPlugin, "type", UniverInstanceType.UNIVER_DOC);
|
|
1046
|
+
_defineProperty(UniverDocsQuickInsertUIPlugin, "pluginName", "DOC_QUICK_INSERT_UI_PLUGIN");
|
|
1047
|
+
_defineProperty(UniverDocsQuickInsertUIPlugin, "packageName", name);
|
|
1048
|
+
_defineProperty(UniverDocsQuickInsertUIPlugin, "version", version);
|
|
1049
|
+
UniverDocsQuickInsertUIPlugin = __decorate([
|
|
1050
|
+
DependentOn(UniverDrawingUIPlugin, UniverDrawingPlugin, UniverDocsDrawingUIPlugin, UniverDocsDrawingPlugin, UniverUIPlugin),
|
|
1051
|
+
__decorateParam(1, Inject(Injector)),
|
|
1052
|
+
__decorateParam(2, Inject(IRenderManagerService)),
|
|
1053
|
+
__decorateParam(3, IConfigService)
|
|
1054
|
+
], UniverDocsQuickInsertUIPlugin);
|
|
1055
|
+
|
|
1056
|
+
//#endregion
|
|
1057
|
+
export { DocQuickInsertPopupService, DocQuickInsertTriggerController, DocQuickInsertUIController, KeywordInputPlaceholderComponentKey, QuickInsertPlaceholderComponentKey, UniverDocsQuickInsertUIPlugin };
|