@univerjs/sheets-crosshair-highlight 0.17.0 → 0.18.0

package/lib/cjs/facade.js

@@ -1 +1 @@
-"use strict";const o=require("@univerjs/core"),r=require("@univerjs/core/facade"),i=require("@univerjs/sheets-crosshair-highlight");class a{get CrosshairHighlightEnabledChanged(){return"CrosshairHighlightEnabledChanged"}get CrosshairHighlightColorChanged(){return"CrosshairHighlightColorChanged"}}class n extends r.FUniver{_initialize(e){const s=e.get(o.ICommandService);this.disposeWithMe(this.registerEventHandler(this.Event.CrosshairHighlightEnabledChanged,()=>s.onCommandExecuted(t=>{if(t.id===i.EnableCrosshairHighlightOperation.id||t.id===i.DisableCrosshairHighlightOperation.id||t.id===i.ToggleCrosshairHighlightOperation.id){const h=this.getActiveSheet();if(!h)return;this.fireEvent(this.Event.CrosshairHighlightEnabledChanged,{enabled:this.getCrosshairHighlightEnabled(),...h})}}))),this.disposeWithMe(this.registerEventHandler(this.Event.CrosshairHighlightColorChanged,()=>s.onCommandExecuted(t=>{if(t.id===i.SetCrosshairHighlightColorOperation.id){const h=this.getActiveSheet();if(!h)return;this.fireEvent(this.Event.CrosshairHighlightColorChanged,{color:this.getCrosshairHighlightColor(),...h})}})))}setCrosshairHighlightEnabled(e){return e?this._commandService.syncExecuteCommand(i.EnableCrosshairHighlightOperation.id):this._commandService.syncExecuteCommand(i.DisableCrosshairHighlightOperation.id),this}setCrosshairHighlightColor(e){return this._commandService.syncExecuteCommand(i.SetCrosshairHighlightColorOperation.id,{value:e}),this}getCrosshairHighlightEnabled(){return this._injector.get(i.SheetsCrosshairHighlightService).enabled}getCrosshairHighlightColor(){return this._injector.get(i.SheetsCrosshairHighlightService).color}get CROSSHAIR_HIGHLIGHT_COLORS(){return i.CROSSHAIR_HIGHLIGHT_COLORS}}r.FEventName.extend(a);r.FUniver.extend(n);
+let e=require(`@univerjs/core`),t=require(`@univerjs/core/facade`),n=require(`@univerjs/sheets-crosshair-highlight`);var r=class{get CrosshairHighlightEnabledChanged(){return`CrosshairHighlightEnabledChanged`}get CrosshairHighlightColorChanged(){return`CrosshairHighlightColorChanged`}},i=class extends t.FUniver{_initialize(t){let r=t.get(e.ICommandService);this.disposeWithMe(this.registerEventHandler(this.Event.CrosshairHighlightEnabledChanged,()=>r.onCommandExecuted(e=>{if(e.id===n.EnableCrosshairHighlightOperation.id||e.id===n.DisableCrosshairHighlightOperation.id||e.id===n.ToggleCrosshairHighlightOperation.id){let e=this.getActiveSheet();if(!e)return;this.fireEvent(this.Event.CrosshairHighlightEnabledChanged,{enabled:this.getCrosshairHighlightEnabled(),...e})}}))),this.disposeWithMe(this.registerEventHandler(this.Event.CrosshairHighlightColorChanged,()=>r.onCommandExecuted(e=>{if(e.id===n.SetCrosshairHighlightColorOperation.id){let e=this.getActiveSheet();if(!e)return;this.fireEvent(this.Event.CrosshairHighlightColorChanged,{color:this.getCrosshairHighlightColor(),...e})}})))}setCrosshairHighlightEnabled(e){return e?this._commandService.syncExecuteCommand(n.EnableCrosshairHighlightOperation.id):this._commandService.syncExecuteCommand(n.DisableCrosshairHighlightOperation.id),this}setCrosshairHighlightColor(e){return this._commandService.syncExecuteCommand(n.SetCrosshairHighlightColorOperation.id,{value:e}),this}getCrosshairHighlightEnabled(){return this._injector.get(n.SheetsCrosshairHighlightService).enabled}getCrosshairHighlightColor(){return this._injector.get(n.SheetsCrosshairHighlightService).color}get CROSSHAIR_HIGHLIGHT_COLORS(){return n.CROSSHAIR_HIGHLIGHT_COLORS}};t.FEventName.extend(r),t.FUniver.extend(i);

package/lib/cjs/index.js

@@ -1 +1,6 @@
-"use strict";var W=Object.defineProperty;var F=(i,e,t)=>e in i?W(i,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):i[e]=t;var l=(i,e,t)=>F(i,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("@univerjs/core"),g=require("rxjs"),$=require("@univerjs/engine-render"),p=require("react"),d=require("@univerjs/ui"),N=require("react/jsx-runtime"),P=require("@univerjs/design"),T=require("@univerjs/sheets"),w=require("@univerjs/sheets-ui"),y=["rgba(158, 109, 227, 0.3)","rgba(254, 75, 75, 0.3)","rgba(255, 140, 81, 0.3)","rgba(164, 220, 22, 0.3)","rgba(45, 174, 255, 0.3)","rgba(58, 96, 247, 0.3)","rgba(242, 72, 166, 0.3)","rgba(153, 153, 153, 0.3)","rgba(158, 109, 227, 0.15)","rgba(254, 75, 75, 0.15)","rgba(255, 140, 81, 0.15)","rgba(164, 220, 22, 0.15)","rgba(45, 174, 255, 0.15)","rgba(58, 96, 247, 0.15)","rgba(242, 72, 166, 0.15)","rgba(153, 153, 153, 0.15)"];class u extends a.Disposable{constructor(){super(...arguments);l(this,"_enabled$",new g.BehaviorSubject(!1));l(this,"enabled$",this._enabled$.asObservable());l(this,"_color$",new g.BehaviorSubject(y[0]));l(this,"color$",this._color$.asObservable())}get enabled(){return this._enabled$.getValue()}get color(){return this._color$.getValue()}dispose(){this._enabled$.complete()}setEnabled(t){this._enabled$.next(t)}setColor(t){this._color$.next(t)}}const I={id:"sheet.operation.toggle-crosshair-highlight",type:a.CommandType.OPERATION,handler(i){const e=i.get(u),t=e.enabled;return e.setEnabled(!t),!0}},M={id:"sheet.operation.set-crosshair-highlight-color",type:a.CommandType.OPERATION,handler(i,{value:e}){const t=i.get(u);return t.enabled||t.setEnabled(!0),t.setColor(e),!0}},L={id:"sheet.operation.enable-crosshair-highlight",type:a.CommandType.OPERATION,handler(i){const e=i.get(u);return e.enabled?!1:(e.setEnabled(!0),!0)}},G={id:"sheet.operation.disable-crosshair-highlight",type:a.CommandType.OPERATION,handler(i){const e=i.get(u);return e.enabled?(e.setEnabled(!1),!0):!1}},X="@univerjs/sheets-crosshair-highlight",z="0.17.0",j={name:X,version:z},K="sheets-crosshair-highlight.config",A={};function V({ref:i,...e}){const{icon:t,id:r,className:s,extend:n,...o}=e,c=`univerjs-icon univerjs-icon-${r} ${s||""}`.trim(),h=p.useRef(`_${ee()}`);return k(t,`${r}`,{defIds:t.defIds,idSuffix:h.current},{ref:i,className:c,...o},n)}function k(i,e,t,r,s){return p.createElement(i.tag,{key:e,...J(i,t,s),...r},(Q(i,t).children||[]).map((n,o)=>k(n,`${e}-${i.tag}-${o}`,t,void 0,s)))}function J(i,e,t){const r={...i.attrs};t!=null&&t.colorChannel1&&r.fill==="colorChannel1"&&(r.fill=t.colorChannel1),i.tag==="mask"&&r.id&&(r.id=r.id+e.idSuffix),Object.entries(r).forEach(([n,o])=>{n==="mask"&&typeof o=="string"&&(r[n]=o.replace(/url\(#(.*)\)/,`url(#$1${e.idSuffix})`))});const{defIds:s}=e;return!s||s.length===0||(i.tag==="use"&&r["xlink:href"]&&(r["xlink:href"]=r["xlink:href"]+e.idSuffix),Object.entries(r).forEach(([n,o])=>{typeof o=="string"&&(r[n]=o.replace(/url\(#(.*)\)/,`url(#$1${e.idSuffix})`))})),r}function Q(i,e){var r;const{defIds:t}=e;return!t||t.length===0?i:i.tag==="defs"&&((r=i.children)!=null&&r.length)?{...i,children:i.children.map(s=>typeof s.attrs.id=="string"&&t&&t.includes(s.attrs.id)?{...s,attrs:{...s.attrs,id:s.attrs.id+e.idSuffix}}:s)}:i}function ee(){return Math.random().toString(36).substring(2,8)}V.displayName="UniverIcon";const te={tag:"svg",attrs:{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em"},children:[{tag:"path",attrs:{fill:"currentColor",d:"M3.6498 1.05005C2.21386 1.05005 1.0498 2.21411 1.0498 3.65005V12.35C1.0498 13.786 2.21386 14.95 3.6498 14.95H12.3498C13.7857 14.95 14.9498 13.786 14.9498 12.3501V3.65005C14.9498 2.21411 13.7857 1.05005 12.3498 1.05005H3.6498ZM5.4002 2.25005H3.6498C2.87661 2.25005 2.2498 2.87685 2.2498 3.65005V5.40002H5.4002V2.25005ZM2.2498 10.6V12.35C2.2498 13.1232 2.87661 13.75 3.6498 13.75H5.4002V10.6H2.2498ZM6.60019 13.75H9.4002V9.40002H13.7498V6.60002H9.4002V2.25005H6.60019V6.60002H2.25029V9.40002H6.60019V13.75ZM10.6002 2.25005V5.40002H13.7498V3.65005C13.7498 2.87685 13.123 2.25005 12.3498 2.25005H10.6002ZM13.7498 10.6H10.6002V13.75H12.3498C13.123 13.75 13.7498 13.1232 13.7498 12.3501V10.6Z",fillRule:"evenodd",clipRule:"evenodd"}}]},U=p.forwardRef(function(e,t){return p.createElement(V,Object.assign({},e,{id:"cross-highlighting-icon",ref:t,icon:te}))});U.displayName="CrossHighlightingIcon";const D="CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT";function re(i){const e=i.get(u);return{id:I.id,tooltip:"crosshair.button.tooltip",type:d.MenuItemType.BUTTON_SELECTOR,icon:"CrossHighlightingIcon",selections:[{label:{name:D,hoverable:!1,selectable:!1}}],selectionsCommandId:M.id,activated$:e.enabled$,hidden$:d.getMenuHiddenObservable(i,a.UniverInstanceType.UNIVER_SHEET)}}const se={[d.ContextMenuPosition.FOOTER_MENU]:{[d.ContextMenuGroup.OTHERS]:{[I.id]:{order:0,menuItemFactory:re}}}};function ie(i){const{onChange:e}=i,t=d.useDependency(u),r=d.useObservable(t.color$),s=p.useCallback(n=>{e==null||e(n)},[e]);return N.jsx("div",{className:"univer-grid univer-grid-cols-8 univer-gap-x-2 univer-gap-y-3",children:y.map(n=>N.jsx("div",{className:P.clsx("hover:univer-ring-primary-600/40 univer-box-border univer-size-5 univer-cursor-pointer univer-rounded univer-ring-offset-1 univer-transition-shadow hover:univer-ring-[1.5px]",P.borderClassName,{"univer-ring-[1.5px] univer-ring-primary-600 hover:univer-ring-primary-600":n===r}),style:{backgroundColor:n},onClick:()=>s(n)},n))})}var ne=Object.getOwnPropertyDescriptor,oe=(i,e,t,r)=>{for(var s=r>1?void 0:r?ne(e,t):e,n=i.length-1,o;n>=0;n--)(o=i[n])&&(s=o(s)||s);return s},E=(i,e)=>(t,r)=>e(t,r,i);let b=class extends a.Disposable{constructor(i,e,t){super(),this._componentMgr=i,this._menuManagerService=e,this._cmdSrv=t,this._initCommands(),this._initMenus(),this._initComponents()}_initCommands(){[I,M,L,G].forEach(i=>this._cmdSrv.registerCommand(i))}_initMenus(){this._menuManagerService.mergeMenu(se)}_initComponents(){this._componentMgr.register(D,ie),this._componentMgr.register("CrossHighlightingIcon",U)}};b=oe([E(0,a.Inject(d.ComponentManager)),E(1,d.IMenuManagerService),E(2,a.ICommandService)],b);const ae=1;class ce{constructor(){l(this,"_selectedRanges",[]);l(this,"_ranges",[])}addRange(e){if(e.rangeType===a.RANGE_TYPE.COLUMN||e.rangeType===a.RANGE_TYPE.ROW||e.rangeType===a.RANGE_TYPE.ALL)return;const t=this._getIntersects(e),r=this._getSplitRanges(e,t);r.length>0&&this._ranges.push(...r)}setSelectedRanges(e){this._selectedRanges=e}_getSplitRanges(e,t){let r=[e];for(const s of t.concat(this._selectedRanges)){const n=[];for(const o of r){const c=a.Rectangle.subtract(o,s);c&&c.length>0&&n.push(...c)}r=n}return r.filter(s=>s.startRow<=s.endRow&&s.startColumn<=s.endColumn)}_getIntersects(e){const t=[];for(const r of this._ranges){const s=a.Rectangle.getIntersects(r,e);s&&t.push(s)}return t}getRanges(){return this._ranges}reset(){this._ranges=[],this._selectedRanges=[]}}class le extends $.Shape{constructor(t,r){super(t,r);l(this,"_color");r&&this.setShapeProps(r)}setShapeProps(t){typeof t.color<"u"&&(this._color=t.color),this.transformByState({width:t.width,height:t.height})}_draw(t){var s,n;const r=`rgba(${this._color.r}, ${this._color.g}, ${this._color.b}, ${(n=(s=this._color)==null?void 0:s.a)!=null?n:.5})`;$.Rect.drawWith(t,{width:this.width,height:this.height,fill:r,stroke:void 0,strokeWidth:0,evented:!1})}}var he=Object.getOwnPropertyDescriptor,ge=(i,e,t,r)=>{for(var s=r>1?void 0:r?he(e,t):e,n=i.length-1,o;n>=0;n--)(o=i[n])&&(s=o(s)||s);return s},v=(i,e)=>(t,r)=>e(t,r,i);let H=class extends a.Disposable{constructor(e,t,r,s,n,o){super();l(this,"_shapes",[]);l(this,"_rangeCollection",new ce);l(this,"_color","rgba(255,0,0,0.5)");this._context=e,this._sheetSkeletonManagerService=t,this._sheetsSelectionsService=r,this._sheetsCrosshairHighlightService=s,this._contextService=n,this._refSelectionsService=o,this._initRenderListener()}_transformSelection(e,t){if(!e)return;const r=t.getRowCount(),s=t.getColumnCount(),n=[];for(const o of e){const{startRow:c,endRow:h,startColumn:f,endColumn:C}=o.range;h-c+1===r||C-f+1===s||n.push(o.range)}this._rangeCollection.setSelectedRanges(n);for(const o of n)this.addSelection(o,t)}_initRenderListener(){const e=this._context.unit;this.disposeWithMe(g.combineLatest([this._contextService.subscribeContextValue$(T.REF_SELECTIONS_ENABLED).pipe(g.startWith(!1)),this._sheetSkeletonManagerService.currentSkeleton$,this._sheetsCrosshairHighlightService.enabled$,this._sheetsCrosshairHighlightService.color$.pipe(g.tap(t=>this._color=t)),g.merge(this._sheetsSelectionsService.selectionMoveStart$,this._sheetsSelectionsService.selectionMoving$,this._sheetsSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe(g.map(()=>this._sheetsSelectionsService.getCurrentSelections()))),g.merge(this._refSelectionsService.selectionMoveStart$,this._refSelectionsService.selectionMoving$,this._refSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe(g.map(()=>this._refSelectionsService.getCurrentSelections())))]).subscribe(([t,r,s,n,o,c])=>{if(this._clear(),!s)return;const h=t?c:o;this._rangeCollection.reset(),this._transformSelection(h,e.getActiveSheet()),this.render(this._rangeCollection.getRanges())}))}addSelection(e,t){if(e.rangeType===a.RANGE_TYPE.COLUMN||e.rangeType===a.RANGE_TYPE.ROW||e.rangeType===a.RANGE_TYPE.ALL)return;const r=t.getRowCount(),s=t.getColumnCount(),{startRow:n,endRow:o,startColumn:c,endColumn:h}=e,f={startRow:n,endRow:o,startColumn:0,endColumn:c-1},C={startRow:n,endRow:o,startColumn:h+1,endColumn:s},m={startRow:0,endRow:n-1,startColumn:c,endColumn:h},R={startRow:o+1,endRow:r,startColumn:c,endColumn:h};for(const _ of[f,C,m,R])_.startRow<=_.endRow&&_.startColumn<=_.endColumn&&this._rangeCollection.addRange(_)}_clear(){this._shapes.forEach(e=>{e.dispose()}),this._shapes=[]}_addShapes(e,t,r,s){const{startRow:n,endRow:o,startColumn:c,endColumn:h}=e,f=w.getCoordByCell(n,c,r,s),C=w.getCoordByCell(o,h,r,s),{startX:m,startY:R}=f,{endX:_,endY:Y}=C,q=_-m,B=Y-R,Z={left:m,top:R,color:new a.ColorKit(this._color).toRgb(),width:q,height:B,zIndex:ae,evented:!1},x=new le(`crosshair-${t}`,Z);this._shapes.push(x),r.addObject(x)}render(e){const t=this._sheetSkeletonManagerService.getCurrentSkeleton();if(!t)return;const{scene:r}=this._context;this._clear();for(let s=0;s<e.length;s++){const n=e[s];this._addShapes(n,s,r,t)}r.makeDirty(!0)}async dispose(){super.dispose()}};H=ge([v(1,a.Inject(w.SheetSkeletonManagerService)),v(2,a.Inject(T.SheetsSelectionsService)),v(3,a.Inject(u)),v(4,a.Inject(a.IContextService)),v(5,T.IRefSelectionsService)],H);var ue=Object.getOwnPropertyDescriptor,de=(i,e,t,r)=>{for(var s=r>1?void 0:r?ue(e,t):e,n=i.length-1,o;n>=0;n--)(o=i[n])&&(s=o(s)||s);return s},O=(i,e)=>(t,r)=>e(t,r,i),S;exports.UniverSheetsCrosshairHighlightPlugin=(S=class extends a.Plugin{constructor(e=A,t,r,s){super(),this._config=e,this._injector=t,this._renderManagerService=r,this._configService=s;const{...n}=a.merge({},A,this._config);this._configService.setConfig(K,n)}onStarting(){[[u],[b]].forEach(e=>this._injector.add(e))}onReady(){[[H]].forEach(e=>this._injector.add(e)),this._injector.get(b),this._renderManagerService.registerRenderModule(a.UniverInstanceType.UNIVER_SHEET,[H])}},l(S,"pluginName","SHEET_CROSSHAIR_HIGHLIGHT_PLUGIN"),l(S,"packageName",j.name),l(S,"version",j.version),l(S,"type",a.UniverInstanceType.UNIVER_SHEET),S);exports.UniverSheetsCrosshairHighlightPlugin=de([O(1,a.Inject(a.Injector)),O(2,$.IRenderManagerService),O(3,a.IConfigService)],exports.UniverSheetsCrosshairHighlightPlugin);exports.CROSSHAIR_HIGHLIGHT_COLORS=y;exports.DisableCrosshairHighlightOperation=G;exports.EnableCrosshairHighlightOperation=L;exports.SetCrosshairHighlightColorOperation=M;exports.SheetsCrosshairHighlightService=u;exports.ToggleCrosshairHighlightOperation=I;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@univerjs/core`),t=require(`rxjs`),n=require(`@univerjs/engine-render`),r=require(`@univerjs/icons`),i=require(`@univerjs/ui`),a=require(`@univerjs/design`),o=require(`react`),s=require(`react/jsx-runtime`),c=require(`@univerjs/sheets`),l=require(`@univerjs/sheets-ui`);function u(e){"@babel/helpers - typeof";return u=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},u(e)}function d(e,t){if(u(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(u(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function f(e){var t=d(e,`string`);return u(t)==`symbol`?t:t+``}function p(e,t,n){return(t=f(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}const m=[`rgba(158, 109, 227, 0.3)`,`rgba(254, 75, 75, 0.3)`,`rgba(255, 140, 81, 0.3)`,`rgba(164, 220, 22, 0.3)`,`rgba(45, 174, 255, 0.3)`,`rgba(58, 96, 247, 0.3)`,`rgba(242, 72, 166, 0.3)`,`rgba(153, 153, 153, 0.3)`,`rgba(158, 109, 227, 0.15)`,`rgba(254, 75, 75, 0.15)`,`rgba(255, 140, 81, 0.15)`,`rgba(164, 220, 22, 0.15)`,`rgba(45, 174, 255, 0.15)`,`rgba(58, 96, 247, 0.15)`,`rgba(242, 72, 166, 0.15)`,`rgba(153, 153, 153, 0.15)`];var h=class extends e.Disposable{constructor(...e){super(...e),p(this,`_enabled$`,new t.BehaviorSubject(!1)),p(this,`enabled$`,this._enabled$.asObservable()),p(this,`_color$`,new t.BehaviorSubject(m[0])),p(this,`color$`,this._color$.asObservable())}get enabled(){return this._enabled$.getValue()}get color(){return this._color$.getValue()}dispose(){this._enabled$.complete()}setEnabled(e){this._enabled$.next(e)}setColor(e){this._color$.next(e)}};const g={id:`sheet.operation.toggle-crosshair-highlight`,type:e.CommandType.OPERATION,handler(e){let t=e.get(h),n=t.enabled;return t.setEnabled(!n),!0}},_={id:`sheet.operation.set-crosshair-highlight-color`,type:e.CommandType.OPERATION,handler(e,{value:t}){let n=e.get(h);return n.enabled||n.setEnabled(!0),n.setColor(t),!0}},v={id:`sheet.operation.enable-crosshair-highlight`,type:e.CommandType.OPERATION,handler(e){let t=e.get(h);return t.enabled?!1:(t.setEnabled(!0),!0)}},y={id:`sheet.operation.disable-crosshair-highlight`,type:e.CommandType.OPERATION,handler(e){let t=e.get(h);return t.enabled?(t.setEnabled(!1),!0):!1}};var b=`@univerjs/sheets-crosshair-highlight`,x=`0.18.0`;const S=`sheets-crosshair-highlight.config`;Symbol(S);const C={},w=`CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT`;function T(t){let n=t.get(h);return{id:g.id,tooltip:`crosshair.button.tooltip`,type:i.MenuItemType.BUTTON_SELECTOR,icon:`CrossHighlightingIcon`,selections:[{label:{name:w,hoverable:!1,selectable:!1}}],selectionsCommandId:_.id,activated$:n.enabled$,hidden$:(0,i.getMenuHiddenObservable)(t,e.UniverInstanceType.UNIVER_SHEET)}}const E={[i.ContextMenuPosition.FOOTER_MENU]:{[i.ContextMenuGroup.OTHERS]:{[g.id]:{order:0,menuItemFactory:T}}}};function D(e){let{onChange:t}=e,n=(0,i.useObservable)((0,i.useDependency)(h).color$),r=(0,o.useCallback)(e=>{t==null||t(e)},[t]);return(0,s.jsx)(`div`,{className:`univer-grid univer-grid-cols-8 univer-gap-x-2 univer-gap-y-3`,children:m.map(e=>(0,s.jsx)(`div`,{className:(0,a.clsx)(`
+                          hover:univer-ring-primary-600/40
+                          univer-box-border univer-size-5 univer-cursor-pointer univer-rounded univer-ring-offset-1
+                          univer-transition-shadow
+                          hover:univer-ring-[1.5px]
+                        `,a.borderClassName,{"univer-ring-[1.5px] univer-ring-primary-600 hover:univer-ring-primary-600":e===n}),style:{backgroundColor:e},onClick:()=>r(e)},e))})}function O(e,t){return function(n,r){t(n,r,e)}}function k(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}let A=class extends e.Disposable{constructor(e,t,n){super(),this._componentMgr=e,this._menuManagerService=t,this._cmdSrv=n,this._initCommands(),this._initMenus(),this._initComponents()}_initCommands(){[g,_,v,y].forEach(e=>this._cmdSrv.registerCommand(e))}_initMenus(){this._menuManagerService.mergeMenu(E)}_initComponents(){this._componentMgr.register(w,D),this._componentMgr.register(`CrossHighlightingIcon`,r.CrossHighlightingIcon)}};A=k([O(0,(0,e.Inject)(i.ComponentManager)),O(1,i.IMenuManagerService),O(2,e.ICommandService)],A);var j=class{constructor(){p(this,`_selectedRanges`,[]),p(this,`_ranges`,[])}addRange(t){if(t.rangeType===e.RANGE_TYPE.COLUMN||t.rangeType===e.RANGE_TYPE.ROW||t.rangeType===e.RANGE_TYPE.ALL)return;let n=this._getIntersects(t),r=this._getSplitRanges(t,n);r.length>0&&this._ranges.push(...r)}setSelectedRanges(e){this._selectedRanges=e}_getSplitRanges(t,n){let r=[t];for(let t of n.concat(this._selectedRanges)){let n=[];for(let i of r){let r=e.Rectangle.subtract(i,t);r&&r.length>0&&n.push(...r)}r=n}return r.filter(e=>e.startRow<=e.endRow&&e.startColumn<=e.endColumn)}_getIntersects(t){let n=[];for(let r of this._ranges){let i=e.Rectangle.getIntersects(r,t);i&&n.push(i)}return n}getRanges(){return this._ranges}reset(){this._ranges=[],this._selectedRanges=[]}},M=class extends n.Shape{constructor(e,t){super(e,t),p(this,`_color`,void 0),t&&this.setShapeProps(t)}setShapeProps(e){e.color!==void 0&&(this._color=e.color),this.transformByState({width:e.width,height:e.height})}_draw(e){var t,r;let i=`rgba(${this._color.r}, ${this._color.g}, ${this._color.b}, ${(t=(r=this._color)==null?void 0:r.a)==null?.5:t})`;n.Rect.drawWith(e,{width:this.width,height:this.height,fill:i,stroke:void 0,strokeWidth:0,evented:!1})}};let N=class extends e.Disposable{constructor(e,t,n,r,i,a){super(),this._context=e,this._sheetSkeletonManagerService=t,this._sheetsSelectionsService=n,this._sheetsCrosshairHighlightService=r,this._contextService=i,this._refSelectionsService=a,p(this,`_shapes`,[]),p(this,`_rangeCollection`,new j),p(this,`_color`,`rgba(255,0,0,0.5)`),this._initRenderListener()}_transformSelection(e,t){if(!e)return;let n=t.getRowCount(),r=t.getColumnCount(),i=[];for(let t of e){let{startRow:e,endRow:a,startColumn:o,endColumn:s}=t.range;a-e+1===n||s-o+1===r||i.push(t.range)}this._rangeCollection.setSelectedRanges(i);for(let e of i)this.addSelection(e,t)}_initRenderListener(){let e=this._context.unit;this.disposeWithMe((0,t.combineLatest)([this._contextService.subscribeContextValue$(c.REF_SELECTIONS_ENABLED).pipe((0,t.startWith)(!1)),this._sheetSkeletonManagerService.currentSkeleton$,this._sheetsCrosshairHighlightService.enabled$,this._sheetsCrosshairHighlightService.color$.pipe((0,t.tap)(e=>this._color=e)),(0,t.merge)(this._sheetsSelectionsService.selectionMoveStart$,this._sheetsSelectionsService.selectionMoving$,this._sheetsSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe((0,t.map)(()=>this._sheetsSelectionsService.getCurrentSelections()))),(0,t.merge)(this._refSelectionsService.selectionMoveStart$,this._refSelectionsService.selectionMoving$,this._refSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe((0,t.map)(()=>this._refSelectionsService.getCurrentSelections())))]).subscribe(([t,n,r,i,a,o])=>{if(this._clear(),!r)return;let s=t?o:a;this._rangeCollection.reset(),this._transformSelection(s,e.getActiveSheet()),this.render(this._rangeCollection.getRanges())}))}addSelection(t,n){if(t.rangeType===e.RANGE_TYPE.COLUMN||t.rangeType===e.RANGE_TYPE.ROW||t.rangeType===e.RANGE_TYPE.ALL)return;let r=n.getRowCount(),i=n.getColumnCount(),{startRow:a,endRow:o,startColumn:s,endColumn:c}=t,l={startRow:a,endRow:o,startColumn:0,endColumn:s-1},u={startRow:a,endRow:o,startColumn:c+1,endColumn:i},d={startRow:0,endRow:a-1,startColumn:s,endColumn:c},f={startRow:o+1,endRow:r,startColumn:s,endColumn:c};for(let e of[l,u,d,f])e.startRow<=e.endRow&&e.startColumn<=e.endColumn&&this._rangeCollection.addRange(e)}_clear(){this._shapes.forEach(e=>{e.dispose()}),this._shapes=[]}_addShapes(t,n,r,i){let{startRow:a,endRow:o,startColumn:s,endColumn:c}=t,u=(0,l.getCoordByCell)(a,s,r,i),d=(0,l.getCoordByCell)(o,c,r,i),{startX:f,startY:p}=u,{endX:m,endY:h}=d,g=m-f,_=h-p,v={left:f,top:p,color:new e.ColorKit(this._color).toRgb(),width:g,height:_,zIndex:1,evented:!1},y=new M(`crosshair-${n}`,v);this._shapes.push(y),r.addObject(y)}render(e){let t=this._sheetSkeletonManagerService.getCurrentSkeleton();if(!t)return;let{scene:n}=this._context;this._clear();for(let r=0;r<e.length;r++){let i=e[r];this._addShapes(i,r,n,t)}n.makeDirty(!0)}async dispose(){super.dispose()}};N=k([O(1,(0,e.Inject)(l.SheetSkeletonManagerService)),O(2,(0,e.Inject)(c.SheetsSelectionsService)),O(3,(0,e.Inject)(h)),O(4,(0,e.Inject)(e.IContextService)),O(5,c.IRefSelectionsService)],N);let P=class extends e.Plugin{constructor(t=C,n,r,i){super(),this._config=t,this._injector=n,this._renderManagerService=r,this._configService=i;let{...a}=(0,e.merge)({},C,this._config);this._configService.setConfig(S,a)}onStarting(){[[h],[A]].forEach(e=>this._injector.add(e))}onReady(){[[N]].forEach(e=>this._injector.add(e)),this._injector.get(A),this._renderManagerService.registerRenderModule(e.UniverInstanceType.UNIVER_SHEET,[N])}};p(P,`pluginName`,`SHEET_CROSSHAIR_HIGHLIGHT_PLUGIN`),p(P,`packageName`,b),p(P,`version`,x),p(P,`type`,e.UniverInstanceType.UNIVER_SHEET),P=k([O(1,(0,e.Inject)(e.Injector)),O(2,n.IRenderManagerService),O(3,e.IConfigService)],P),exports.CROSSHAIR_HIGHLIGHT_COLORS=m,exports.DisableCrosshairHighlightOperation=y,exports.EnableCrosshairHighlightOperation=v,exports.SetCrosshairHighlightColorOperation=_,exports.SheetsCrosshairHighlightService=h,exports.ToggleCrosshairHighlightOperation=g,Object.defineProperty(exports,`UniverSheetsCrosshairHighlightPlugin`,{enumerable:!0,get:function(){return P}});

package/lib/cjs/locale/ca-ES.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"Ressaltat de creu"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`Ressaltat de creu`}}};module.exports=e;

package/lib/cjs/locale/en-US.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"Crosshair Highlight"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`Crosshair Highlight`}}};module.exports=e;

package/lib/cjs/locale/es-ES.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"Resaltado de cruz"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`Resaltado de cruz`}}};module.exports=e;

package/lib/cjs/locale/fa-IR.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"برجسته کردن خط نشانه"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`برجسته کردن خط نشانه`}}};module.exports=e;

package/lib/cjs/locale/fr-FR.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"Surlignage du réticule"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`Surlignage du réticule`}}};module.exports=e;

package/lib/cjs/locale/ja-JP.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"십자선 강조"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`십자선 강조`}}};module.exports=e;

package/lib/cjs/locale/ko-KR.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"십자선 강조"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`십자선 강조`}}};module.exports=e;

package/lib/cjs/locale/ru-RU.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"Перекрестный выделение"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`Перекрестный выделение`}}};module.exports=e;

package/lib/cjs/locale/sk-SK.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"Zvýraznenie krížika"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`Zvýraznenie krížika`}}};module.exports=e;

package/lib/cjs/locale/vi-VN.js

@@ -1 +1 @@
-"use strict";const o={crosshair:{button:{tooltip:"Đánh dấu chéo"}}};module.exports=o;
+const e={crosshair:{button:{tooltip:`Đánh dấu chéo`}}};module.exports=e;

package/lib/cjs/locale/zh-CN.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"十字高亮"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`十字高亮`}}};module.exports=e;

package/lib/cjs/locale/zh-TW.js

@@ -1 +1 @@
-"use strict";const t={crosshair:{button:{tooltip:"十字高亮"}}};module.exports=t;
+const e={crosshair:{button:{tooltip:`十字高亮`}}};module.exports=e;

package/lib/es/facade.js

@@ -1,67 +1 @@
-import { ICommandService as l } from "@univerjs/core";
-import { FEventName as C, FUniver as n } from "@univerjs/core/facade";
-import { EnableCrosshairHighlightOperation as r, DisableCrosshairHighlightOperation as s, ToggleCrosshairHighlightOperation as d, SetCrosshairHighlightColorOperation as g, SheetsCrosshairHighlightService as o, CROSSHAIR_HIGHLIGHT_COLORS as c } from "@univerjs/sheets-crosshair-highlight";
-class H {
-  get CrosshairHighlightEnabledChanged() {
-    return "CrosshairHighlightEnabledChanged";
-  }
-  get CrosshairHighlightColorChanged() {
-    return "CrosshairHighlightColorChanged";
-  }
-}
-class v extends n {
-  /**
-   * @ignore
-   */
-  _initialize(i) {
-    const h = i.get(l);
-    this.disposeWithMe(
-      this.registerEventHandler(
-        this.Event.CrosshairHighlightEnabledChanged,
-        () => h.onCommandExecuted((e) => {
-          if (e.id === r.id || e.id === s.id || e.id === d.id) {
-            const t = this.getActiveSheet();
-            if (!t) return;
-            this.fireEvent(this.Event.CrosshairHighlightEnabledChanged, {
-              enabled: this.getCrosshairHighlightEnabled(),
-              ...t
-            });
-          }
-        })
-      )
-    ), this.disposeWithMe(
-      this.registerEventHandler(
-        this.Event.CrosshairHighlightColorChanged,
-        () => h.onCommandExecuted((e) => {
-          if (e.id === g.id) {
-            const t = this.getActiveSheet();
-            if (!t) return;
-            this.fireEvent(this.Event.CrosshairHighlightColorChanged, {
-              color: this.getCrosshairHighlightColor(),
-              ...t
-            });
-          }
-        })
-      )
-    );
-  }
-  setCrosshairHighlightEnabled(i) {
-    return i ? this._commandService.syncExecuteCommand(r.id) : this._commandService.syncExecuteCommand(s.id), this;
-  }
-  setCrosshairHighlightColor(i) {
-    return this._commandService.syncExecuteCommand(g.id, {
-      value: i
-    }), this;
-  }
-  getCrosshairHighlightEnabled() {
-    return this._injector.get(o).enabled;
-  }
-  getCrosshairHighlightColor() {
-    return this._injector.get(o).color;
-  }
-  get CROSSHAIR_HIGHLIGHT_COLORS() {
-    return c;
-  }
-}
-C.extend(H);
-n.extend(v);
+import{ICommandService as e}from"@univerjs/core";import{FEventName as t,FUniver as n}from"@univerjs/core/facade";import{CROSSHAIR_HIGHLIGHT_COLORS as r,DisableCrosshairHighlightOperation as i,EnableCrosshairHighlightOperation as a,SetCrosshairHighlightColorOperation as o,SheetsCrosshairHighlightService as s,ToggleCrosshairHighlightOperation as c}from"@univerjs/sheets-crosshair-highlight";var l=class{get CrosshairHighlightEnabledChanged(){return`CrosshairHighlightEnabledChanged`}get CrosshairHighlightColorChanged(){return`CrosshairHighlightColorChanged`}},u=class extends n{_initialize(t){let n=t.get(e);this.disposeWithMe(this.registerEventHandler(this.Event.CrosshairHighlightEnabledChanged,()=>n.onCommandExecuted(e=>{if(e.id===a.id||e.id===i.id||e.id===c.id){let e=this.getActiveSheet();if(!e)return;this.fireEvent(this.Event.CrosshairHighlightEnabledChanged,{enabled:this.getCrosshairHighlightEnabled(),...e})}}))),this.disposeWithMe(this.registerEventHandler(this.Event.CrosshairHighlightColorChanged,()=>n.onCommandExecuted(e=>{if(e.id===o.id){let e=this.getActiveSheet();if(!e)return;this.fireEvent(this.Event.CrosshairHighlightColorChanged,{color:this.getCrosshairHighlightColor(),...e})}})))}setCrosshairHighlightEnabled(e){return e?this._commandService.syncExecuteCommand(a.id):this._commandService.syncExecuteCommand(i.id),this}setCrosshairHighlightColor(e){return this._commandService.syncExecuteCommand(o.id,{value:e}),this}getCrosshairHighlightEnabled(){return this._injector.get(s).enabled}getCrosshairHighlightColor(){return this._injector.get(s).color}get CROSSHAIR_HIGHLIGHT_COLORS(){return r}};t.extend(l),n.extend(u);export{};