dockview-react 7.0.4 → 8.1.0
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/LICENCE.md +21 -0
- package/README.md +21 -16
- package/dist/cjs/dockview/reactContextMenuItemPart.d.ts +10 -3
- package/dist/cjs/index.d.ts +2 -2
- package/dist/cjs/svg.d.ts +1 -0
- package/dist/dockview-react.js +19294 -21736
- package/dist/dockview-react.min.js +4142 -22
- package/dist/package/main.cjs.js +960 -986
- package/dist/package/main.cjs.min.js +6 -6
- package/dist/package/main.esm.min.mjs +6 -6
- package/dist/package/main.esm.mjs +926 -977
- package/dist/styles/dockview.css +3098 -2400
- package/package.json +91 -85
- package/dist/cjs/dockview/defaultTab.js +0 -99
- package/dist/cjs/dockview/dockview.js +0 -285
- package/dist/cjs/dockview/headerActionsRenderer.js +0 -86
- package/dist/cjs/dockview/reactContentPart.js +0 -52
- package/dist/cjs/dockview/reactContextMenuItemPart.js +0 -31
- package/dist/cjs/dockview/reactGroupDragGhostPart.js +0 -32
- package/dist/cjs/dockview/reactHeaderPart.js +0 -46
- package/dist/cjs/dockview/reactTabGroupChipPart.js +0 -36
- package/dist/cjs/dockview/reactWatermarkPart.js +0 -47
- package/dist/cjs/gridview/gridview.js +0 -105
- package/dist/cjs/gridview/view.js +0 -41
- package/dist/cjs/index.js +0 -24
- package/dist/cjs/paneview/paneview.js +0 -137
- package/dist/cjs/paneview/view.js +0 -44
- package/dist/cjs/react.js +0 -183
- package/dist/cjs/splitview/splitview.js +0 -105
- package/dist/cjs/splitview/view.js +0 -39
- package/dist/cjs/svg.js +0 -15
- package/dist/cjs/types.js +0 -2
- package/dist/dockview-react.min.js.map +0 -1
- package/dist/esm/dockview/defaultTab.d.ts +0 -7
- package/dist/esm/dockview/defaultTab.js +0 -65
- package/dist/esm/dockview/dockview.d.ts +0 -33
- package/dist/esm/dockview/dockview.js +0 -252
- package/dist/esm/dockview/headerActionsRenderer.d.ts +0 -24
- package/dist/esm/dockview/headerActionsRenderer.js +0 -72
- package/dist/esm/dockview/reactContentPart.d.ts +0 -21
- package/dist/esm/dockview/reactContentPart.js +0 -43
- package/dist/esm/dockview/reactContextMenuItemPart.d.ts +0 -14
- package/dist/esm/dockview/reactContextMenuItemPart.js +0 -22
- package/dist/esm/dockview/reactGroupDragGhostPart.d.ts +0 -20
- package/dist/esm/dockview/reactGroupDragGhostPart.js +0 -23
- package/dist/esm/dockview/reactHeaderPart.d.ts +0 -17
- package/dist/esm/dockview/reactHeaderPart.js +0 -37
- package/dist/esm/dockview/reactTabGroupChipPart.d.ts +0 -23
- package/dist/esm/dockview/reactTabGroupChipPart.js +0 -27
- package/dist/esm/dockview/reactWatermarkPart.d.ts +0 -18
- package/dist/esm/dockview/reactWatermarkPart.js +0 -38
- package/dist/esm/gridview/gridview.d.ts +0 -17
- package/dist/esm/gridview/gridview.js +0 -72
- package/dist/esm/gridview/view.d.ts +0 -9
- package/dist/esm/gridview/view.js +0 -19
- package/dist/esm/index.d.ts +0 -10
- package/dist/esm/index.js +0 -8
- package/dist/esm/paneview/paneview.d.ts +0 -20
- package/dist/esm/paneview/paneview.js +0 -104
- package/dist/esm/paneview/view.d.ts +0 -19
- package/dist/esm/paneview/view.js +0 -35
- package/dist/esm/react.d.ts +0 -35
- package/dist/esm/react.js +0 -134
- package/dist/esm/splitview/splitview.d.ts +0 -17
- package/dist/esm/splitview/splitview.js +0 -72
- package/dist/esm/splitview/view.d.ts +0 -9
- package/dist/esm/splitview/view.js +0 -17
- package/dist/esm/svg.d.ts +0 -3
- package/dist/esm/svg.js +0 -7
- package/dist/esm/types.d.ts +0 -4
- package/dist/esm/types.js +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("dockview"),t=require("react"),n=require("react-dom");const o=(e,n)=>{const[,o]=t.useState(0),r=t.useRef(e.componentProps);return t.useImperativeHandle(n,()=>({update:e=>{r.current=Object.assign(Object.assign({},r.current),e),o(e=>e+1)}}),[]),t.createElement(e.component,r.current)};o.displayName="DockviewReactJsBridge";const r=(()=>{let e=1;return{next:()=>`dockview_react_portal_key_${(e++).toString()}`}})(),a=t.createContext({});class i{constructor(e,t,n,o,r){this.parent=e,this.portalStore=t,this.component=n,this.parameters=o,this.context=r,this._initialProps={},this.disposed=!1,this.createPortal()}update(e){if(this.disposed)throw new Error("invalid operation: resource is already disposed");this.componentInstance?this.componentInstance.update(e):this._initialProps=Object.assign(Object.assign({},this._initialProps),e)}createPortal(){if(this.disposed)throw new Error("invalid operation: resource is already disposed");if(!c(this.component))throw new Error("Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components");const e=t.createElement(t.forwardRef(o),{component:this.component,componentProps:this.parameters,ref:e=>{this.componentInstance=e,Object.keys(this._initialProps).length>0&&(this.componentInstance.update(this._initialProps),this._initialProps={})}}),i=this.context?t.createElement(a.Provider,{value:this.context},e):e,s=n.createPortal(i,this.parent,r.next());this.ref={portal:s,disposable:this.portalStore.addPortal(s)}}dispose(){var e;null===(e=this.ref)||void 0===e||e.disposable.dispose(),this.disposed=!0}}const s=()=>{const[n,o]=t.useState([]);t.useDebugValue(`Portal count: ${n.length}`);return[n,t.useCallback(t=>{o(e=>[...e,t]);let n=!1;return e.DockviewDisposable.from(()=>{if(n)throw new Error("invalid operation: resource already disposed");n=!0,o(e=>e.filter(e=>e!==t))})},[])]};function c(e){return"function"==typeof e||!!(null==e?void 0:e.$$typeof)}class p{get element(){return this._element}constructor(t,n,o){this.id=t,this.component=n,this.reactPortalStore=o,this._onDidFocus=new e.DockviewEmitter,this.onDidFocus=this._onDidFocus.event,this._onDidBlur=new e.DockviewEmitter,this.onDidBlur=this._onDidBlur.event,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}focus(){}init(e){this.part=new i(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi})}update(e){var t;null===(t=this.part)||void 0===t||t.update({params:e.params})}layout(e,t){}dispose(){var e;this._onDidFocus.dispose(),this._onDidBlur.dispose(),null===(e=this.part)||void 0===e||e.dispose()}}class l{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}focus(){}init(e){this.part=new i(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi,tabLocation:e.tabLocation})}update(e){var t;null===(t=this.part)||void 0===t||t.update({params:e.params})}layout(e,t){}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class u{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}init(e){this.part=new i(this.element,this.reactPortalStore,this.component,{group:e.group,containerApi:e.containerApi})}focus(){}update(e){var t,n,o;this.parameters&&(this.parameters.params=e.params),null===(t=this.part)||void 0===t||t.update({params:null!==(o=null===(n=this.parameters)||void 0===n?void 0:n.params)&&void 0!==o?o:{}})}layout(e,t){}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class d{get element(){return this._element}get part(){return this._part}constructor(t,n,o){this.component=t,this.reactPortalStore=n,this._group=o,this.mutableDisposable=new e.DockviewMutableDisposable,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}init(t){this.mutableDisposable.value=new e.DockviewCompositeDisposable(this._group.model.onDidAddPanel(()=>{this.updatePanels()}),this._group.model.onDidRemovePanel(()=>{this.updatePanels()}),this._group.model.onDidActivePanelChange(()=>{this.updateActivePanel()}),t.api.onDidActiveChange(()=>{this.updateGroupActive()}),t.api.onDidLocationChange(e=>{this.updateLocation(e.location)})),this._part=new i(this.element,this.reactPortalStore,this.component,{api:t.api,containerApi:t.containerApi,panels:this._group.model.panels,activePanel:this._group.model.activePanel,isGroupActive:this._group.api.isActive,group:this._group,headerPosition:this._group.model.headerPosition,location:t.api.location})}dispose(){var e;this.mutableDisposable.dispose(),null===(e=this._part)||void 0===e||e.dispose()}update(e){var t;null===(t=this._part)||void 0===t||t.update(e.params)}updatePanels(){this.update({params:{panels:this._group.model.panels}})}updateActivePanel(){this.update({params:{activePanel:this._group.model.activePanel}})}updateGroupActive(){this.update({params:{isGroupActive:this._group.api.isActive}})}updateLocation(e){this.update({params:{location:e}})}}class m{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}init(e){this.part=new i(this._element,this.reactPortalStore,this.component,e)}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class h{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.display="inline-flex"}init(e){this.part=new i(this._element,this.reactPortalStore,this.component,{tabGroup:e.tabGroup,api:e.api})}update(e){var t;null===(t=this.part)||void 0===t||t.update({tabGroup:e.tabGroup})}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class f{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.display="inline-flex"}init(e){this.part=new i(this._element,this.reactPortalStore,this.component,{group:e.group,api:e.api})}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}function v(e,t){return e?n=>new d(e,t,n):void 0}const P="props.defaultTabComponent";const w=t.forwardRef((n,o)=>{const r=t.useRef(null),a=t.useRef(void 0),[i,c]=s();t.useImperativeHandle(o,()=>r.current,[]);const d=t.useRef({});return t.useEffect(()=>{const t={};e.PROPERTY_KEYS_DOCKVIEW.forEach(e=>{const o=e,r=n[o];o in n&&r!==d.current[o]&&(t[o]=r)}),a.current&&a.current.updateOptions(t),d.current=n},e.PROPERTY_KEYS_DOCKVIEW.map(e=>n[e])),t.useEffect(()=>{var t;if(!r.current)return;const o=null!==(t=n.tabComponents)&&void 0!==t?t:{};n.defaultTabComponent&&(o[P]=n.defaultTabComponent);const i={createLeftHeaderActionComponent:v(n.leftHeaderActionsComponent,{addPortal:c}),createRightHeaderActionComponent:v(n.rightHeaderActionsComponent,{addPortal:c}),createPrefixHeaderActionComponent:v(n.prefixHeaderActionsComponent,{addPortal:c}),createComponent:e=>new p(e.id,n.components[e.name],{addPortal:c}),createTabComponent:e=>new l(e.id,o[e.name],{addPortal:c}),createWatermarkComponent:n.watermarkComponent?()=>new u("watermark",n.watermarkComponent,{addPortal:c}):void 0,defaultTabComponent:n.defaultTabComponent?P:void 0,createContextMenuItemComponent:e=>{if(e.component)return new m(e.id,e.component,{addPortal:c})}},s=function(t){return e.PROPERTY_KEYS_DOCKVIEW.reduce((e,n)=>(n in t&&(e[n]=t[n]),e),{})}(n);if(n.tabGroupChipComponent){const e=n.tabGroupChipComponent;s.createTabGroupChipComponent=()=>new h(e,{addPortal:c})}if(n.groupDragGhostComponent){const e=n.groupDragGhostComponent;s.createGroupDragGhostComponent=()=>new f(e,{addPortal:c})}const d=e.createDockview(r.current,Object.assign(Object.assign({},s),i)),{clientWidth:w,clientHeight:C}=r.current;return d.layout(w,C),n.onReady&&n.onReady({api:d}),a.current=d,()=>{a.current=void 0,d.dispose()}},[]),t.useEffect(()=>{if(!a.current)return()=>{};const e=a.current.onDidDrop(e=>{n.onDidDrop&&n.onDidDrop(e)});return()=>{e.dispose()}},[n.onDidDrop]),t.useEffect(()=>{if(!a.current)return()=>{};const e=a.current.onWillDrop(e=>{n.onWillDrop&&n.onWillDrop(e)});return()=>{e.dispose()}},[n.onWillDrop]),t.useEffect(()=>{a.current&&a.current.updateOptions({createTabGroupChipComponent:n.tabGroupChipComponent?()=>new h(n.tabGroupChipComponent,{addPortal:c}):void 0})},[n.tabGroupChipComponent]),t.useEffect(()=>{a.current&&a.current.updateOptions({createGroupDragGhostComponent:n.groupDragGhostComponent?()=>new f(n.groupDragGhostComponent,{addPortal:c}):void 0})},[n.groupDragGhostComponent]),t.useEffect(()=>{a.current&&a.current.updateOptions({createComponent:e=>new p(e.id,n.components[e.name],{addPortal:c})})},[n.components]),t.useEffect(()=>{var e;if(!a.current)return;const t=null!==(e=n.tabComponents)&&void 0!==e?e:{};n.defaultTabComponent&&(t[P]=n.defaultTabComponent),a.current.updateOptions({defaultTabComponent:n.defaultTabComponent?P:void 0,createTabComponent:e=>new l(e.id,t[e.name],{addPortal:c})})},[n.tabComponents,n.defaultTabComponent]),t.useEffect(()=>{a.current&&a.current.updateOptions({createWatermarkComponent:n.watermarkComponent?()=>new u("watermark",n.watermarkComponent,{addPortal:c}):void 0})},[n.watermarkComponent]),t.useEffect(()=>{a.current&&a.current.updateOptions({createRightHeaderActionComponent:v(n.rightHeaderActionsComponent,{addPortal:c})})},[n.rightHeaderActionsComponent]),t.useEffect(()=>{a.current&&a.current.updateOptions({createLeftHeaderActionComponent:v(n.leftHeaderActionsComponent,{addPortal:c})})},[n.leftHeaderActionsComponent]),t.useEffect(()=>{a.current&&a.current.updateOptions({createPrefixHeaderActionComponent:v(n.prefixHeaderActionsComponent,{addPortal:c})})},[n.prefixHeaderActionsComponent]),t.createElement("div",{style:{height:"100%",width:"100%"},ref:r},i)});w.displayName="DockviewComponent","function"==typeof SuppressedError&&SuppressedError;const C=()=>t.createElement("svg",{height:"11",width:"11",viewBox:"0 0 28 28","aria-hidden":"false",focusable:!1,className:"dv-svg"},t.createElement("path",{d:"M2.1 27.3L0 25.2L11.55 13.65L0 2.1L2.1 0L13.65 11.55L25.2 0L27.3 2.1L15.75 13.65L27.3 25.2L25.2 27.3L13.65 15.75L2.1 27.3Z"}));class _ extends e.SplitviewPanel{constructor(e,t,n,o){super(e,t),this.reactComponent=n,this.reactPortalStore=o}getComponent(){var t,n;return new i(this.element,this.reactPortalStore,this.reactComponent,{params:null!==(n=null===(t=this._params)||void 0===t?void 0:t.params)&&void 0!==n?n:{},api:this.api,containerApi:new e.SplitviewApi(this._params.accessor)})}}const E=t.forwardRef((n,o)=>{const r=t.useRef(null),a=t.useRef(void 0),[i,c]=s();t.useImperativeHandle(o,()=>r.current,[]);const p=t.useRef({});return t.useEffect(()=>{const t={};e.PROPERTY_KEYS_SPLITVIEW.forEach(e=>{const o=e,r=n[o];o in n&&r!==p.current[o]&&(t[o]=r)}),a.current&&a.current.updateOptions(t),p.current=n},e.PROPERTY_KEYS_SPLITVIEW.map(e=>n[e])),t.useEffect(()=>{if(!r.current)return()=>{};const t={createComponent:e=>new _(e.id,e.name,n.components[e.name],{addPortal:c})},o=e.createSplitview(r.current,Object.assign(Object.assign({},function(t){return e.PROPERTY_KEYS_SPLITVIEW.reduce((e,n)=>(n in t&&(e[n]=t[n]),e),{})}(n)),t)),{clientWidth:i,clientHeight:s}=r.current;return o.layout(i,s),n.onReady&&n.onReady({api:o}),a.current=o,()=>{a.current=void 0,o.dispose()}},[]),t.useEffect(()=>{a.current&&a.current.updateOptions({createComponent:e=>new _(e.id,e.name,n.components[e.name],{addPortal:c})})},[n.components]),t.createElement("div",{style:{height:"100%",width:"100%"},ref:r},i)});E.displayName="SplitviewComponent";class g extends e.GridviewPanel{constructor(e,t,n,o){super(e,t),this.reactComponent=n,this.reactPortalStore=o}getComponent(){var t,n;return new i(this.element,this.reactPortalStore,this.reactComponent,{params:null!==(n=null===(t=this._params)||void 0===t?void 0:t.params)&&void 0!==n?n:{},api:this.api,containerApi:new e.GridviewApi(this._params.accessor)})}}const b=t.forwardRef((n,o)=>{const r=t.useRef(null),a=t.useRef(void 0),[i,c]=s();t.useImperativeHandle(o,()=>r.current,[]);const p=t.useRef({});return t.useEffect(()=>{const t={};e.PROPERTY_KEYS_GRIDVIEW.forEach(e=>{const o=e,r=n[o];o in n&&r!==p.current[o]&&(t[o]=r)}),a.current&&a.current.updateOptions(t),p.current=n},e.PROPERTY_KEYS_GRIDVIEW.map(e=>n[e])),t.useEffect(()=>{if(!r.current)return()=>{};const t={createComponent:e=>new g(e.id,e.name,n.components[e.name],{addPortal:c})},o=e.createGridview(r.current,Object.assign(Object.assign({},function(t){return e.PROPERTY_KEYS_GRIDVIEW.reduce((e,n)=>(n in t&&(e[n]=t[n]),e),{})}(n)),t)),{clientWidth:i,clientHeight:s}=r.current;return o.layout(i,s),n.onReady&&n.onReady({api:o}),a.current=o,()=>{a.current=void 0,o.dispose()}},[]),t.useEffect(()=>{a.current&&a.current.updateOptions({createComponent:e=>new g(e.id,e.name,n.components[e.name],{addPortal:c})})},[n.components]),t.createElement("div",{style:{height:"100%",width:"100%"},ref:r},i)});b.displayName="GridviewComponent";class D{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.style.height="100%",this._element.style.width="100%"}init(e){this.part=new i(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,title:e.title,containerApi:e.containerApi})}toJSON(){return{id:this.id}}update(e){var t;null===(t=this.part)||void 0===t||t.update(e.params)}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}const R=t.forwardRef((n,o)=>{const r=t.useRef(null),a=t.useRef(void 0),[i,c]=s();t.useImperativeHandle(o,()=>r.current,[]);const p=t.useRef({});return t.useEffect(()=>{const t={};e.PROPERTY_KEYS_PANEVIEW.forEach(e=>{const o=e,r=n[o];o in n&&r!==p.current[o]&&(t[o]=r)}),a.current&&a.current.updateOptions(t),p.current=n},e.PROPERTY_KEYS_PANEVIEW.map(e=>n[e])),t.useEffect(()=>{var t;if(!r.current)return()=>{};const o=null!==(t=n.headerComponents)&&void 0!==t?t:{},i={createComponent:e=>new D(e.id,n.components[e.name],{addPortal:c}),createHeaderComponent:e=>new D(e.id,o[e.name],{addPortal:c})},s=e.createPaneview(r.current,Object.assign(Object.assign({},function(t){return e.PROPERTY_KEYS_PANEVIEW.reduce((e,n)=>(n in t&&(e[n]=t[n]),e),{})}(n)),i)),{clientWidth:p,clientHeight:l}=r.current;return s.layout(p,l),n.onReady&&n.onReady({api:s}),a.current=s,()=>{a.current=void 0,s.dispose()}},[]),t.useEffect(()=>{a.current&&a.current.updateOptions({createComponent:e=>new D(e.id,n.components[e.name],{addPortal:c})})},[n.components]),t.useEffect(()=>{var e;if(!a.current)return;const t=null!==(e=n.headerComponents)&&void 0!==e?e:{};a.current.updateOptions({createHeaderComponent:e=>new D(e.id,t[e.name],{addPortal:c})})},[n.headerComponents]),t.useEffect(()=>{if(!a.current)return()=>{};const e=a.current.onDidDrop(e=>{n.onDidDrop&&n.onDidDrop(e)});return()=>{e.dispose()}},[n.onDidDrop]),t.createElement("div",{style:{height:"100%",width:"100%"},ref:r},i)});R.displayName="PaneviewComponent",exports.DockviewDefaultTab=e=>{var{api:n,containerApi:o,params:r,hideClose:a,closeActionOverride:i,onPointerDown:s,onPointerUp:c,onPointerLeave:p,tabLocation:l}=e,u=function(e,t){var n={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(o=Object.getOwnPropertySymbols(e);r<o.length;r++)t.indexOf(o[r])<0&&Object.prototype.propertyIsEnumerable.call(e,o[r])&&(n[o[r]]=e[o[r]])}return n}(e,["api","containerApi","params","hideClose","closeActionOverride","onPointerDown","onPointerUp","onPointerLeave","tabLocation"]);const d=function(e){const[n,o]=t.useState(e.title);return t.useEffect(()=>{const t=e.onDidTitleChange(e=>{o(e.title)});return n!==e.title&&o(e.title),()=>{t.dispose()}},[e]),n}(n),m=t.useRef(!1),h=t.useCallback(e=>{e.preventDefault(),i?i():n.close()},[n,i]),f=t.useCallback(e=>{e.preventDefault()},[]),v=t.useCallback(e=>{m.current=1===e.button,null==s||s(e)},[s]),P=t.useCallback(e=>{m&&1===e.button&&!a&&(m.current=!1,h(e)),null==c||c(e)},[c,h,a]),w=t.useCallback(e=>{m.current=!1,null==p||p(e)},[p]);return t.createElement("div",Object.assign({"data-testid":"dockview-dv-default-tab"},u,{onPointerDown:v,onPointerUp:P,onPointerLeave:w,className:"dv-default-tab"}),t.createElement("span",{className:"dv-default-tab-content"},d),!a&&t.createElement("div",{className:"dv-default-tab-action",onPointerDown:f,onClick:h},t.createElement(C,null)))},exports.DockviewReact=w,exports.GridviewReact=b,exports.PaneviewReact=R,exports.ReactPart=i,exports.ReactPartContext=a,exports.SplitviewReact=E,exports.isReactComponent=c,exports.usePortalsLifecycle=s,Object.keys(e).forEach(function(t){"default"===t||Object.prototype.hasOwnProperty.call(exports,t)||Object.defineProperty(exports,t,{enumerable:!0,get:function(){return e[t]}})});
|
|
2
|
+
* dockview-react
|
|
3
|
+
* @version 8.1.0
|
|
4
|
+
* @link https://github.com/dockview/dockview
|
|
5
|
+
* @license MIT
|
|
6
|
+
*/
|
|
7
|
+
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require("dockview"),l=require("react");l=s(l);let u=require("react-dom");u=s(u);function d(e){"@babel/helpers - typeof";return d=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},d(e)}function f(e,t){if(d(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(d(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function p(e){var t=f(e,`string`);return d(t)==`symbol`?t:t+``}function m(e,t,n){return(t=p(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function h(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,r)}return n}function g(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]==null?{}:arguments[t];t%2?h(Object(n),!0).forEach(function(t){m(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):h(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}const _=(e,t)=>{let[,n]=l.default.useState(0),r=l.default.useRef(e.componentProps);return l.default.useImperativeHandle(t,()=>({update:e=>{r.current=g(g({},r.current),e),n(e=>e+1)}}),[]),l.default.createElement(e.component,r.current)};_.displayName=`DockviewReactJsBridge`;const v=(()=>{let e=1;return{next:()=>`dockview_react_portal_key_${(e++).toString()}`}})(),y=l.default.createContext({});var b=class{constructor(e,t,n,r,i){this.parent=e,this.portalStore=t,this.component=n,this.parameters=r,this.context=i,this._initialProps={},this.disposed=!1,this.createPortal()}update(e){if(this.disposed)throw Error(`invalid operation: resource is already disposed`);this.componentInstance?this.componentInstance.update(e):this._initialProps=g(g({},this._initialProps),e)}createPortal(){if(this.disposed)throw Error(`invalid operation: resource is already disposed`);if(!S(this.component))throw Error(`Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components`);let e=l.default.createElement(l.default.forwardRef(_),{component:this.component,componentProps:this.parameters,ref:e=>{this.componentInstance=e,Object.keys(this._initialProps).length>0&&(this.componentInstance.update(this._initialProps),this._initialProps={})}}),t=this.context?l.default.createElement(y.Provider,{value:this.context},e):e,n=u.default.createPortal(t,this.parent,v.next());this.ref={portal:n,disposable:this.portalStore.addPortal(n)}}dispose(){var e;(e=this.ref)==null||e.disposable.dispose(),this.disposed=!0}};const x=()=>{let[e,t]=l.default.useState([]);return l.default.useDebugValue(`Portal count: ${e.length}`),[e,l.default.useCallback(e=>{t(t=>[...t,e]);let n=!1;return c.DockviewDisposable.from(()=>{if(n)throw Error(`invalid operation: resource already disposed`);n=!0,t(t=>t.filter(t=>t!==e))})},[])]};function S(e){return typeof e==`function`||!!(e!=null&&e.$$typeof)}var C=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._onDidFocus=new c.DockviewEmitter,this.onDidFocus=this._onDidFocus.event,this._onDidBlur=new c.DockviewEmitter,this.onDidBlur=this._onDidBlur.event,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}focus(){}init(e){this.part=new b(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi})}update(e){var t;(t=this.part)==null||t.update({params:e.params})}layout(e,t){}dispose(){var e;this._onDidFocus.dispose(),this._onDidBlur.dispose(),(e=this.part)==null||e.dispose()}},w=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}focus(){}init(e){this.part=new b(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi,tabLocation:e.tabLocation})}update(e){var t;(t=this.part)==null||t.update({params:e.params})}layout(e,t){}dispose(){var e;(e=this.part)==null||e.dispose()}},T=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}init(e){this.part=new b(this.element,this.reactPortalStore,this.component,{group:e.group,containerApi:e.containerApi})}focus(){}update(e){var t,n,r;this.parameters&&(this.parameters.params=e.params),(t=this.part)==null||t.update({params:(n=(r=this.parameters)==null?void 0:r.params)==null?{}:n})}layout(e,t){}dispose(){var e;(e=this.part)==null||e.dispose()}},E=class{get element(){return this._element}get part(){return this._part}constructor(e,t,n){this.component=e,this.reactPortalStore=t,this._group=n,this.mutableDisposable=new c.DockviewMutableDisposable,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}init(e){this.mutableDisposable.value=new c.DockviewCompositeDisposable(this._group.model.onDidAddPanel(()=>{this.updatePanels()}),this._group.model.onDidRemovePanel(()=>{this.updatePanels()}),this._group.model.onDidActivePanelChange(()=>{this.updateActivePanel()}),e.api.onDidActiveChange(()=>{this.updateGroupActive()}),e.api.onDidLocationChange(e=>{this.updateLocation(e.location)})),this._part=new b(this.element,this.reactPortalStore,this.component,{api:e.api,containerApi:e.containerApi,panels:this._group.model.panels,activePanel:this._group.model.activePanel,isGroupActive:this._group.api.isActive,group:this._group,headerPosition:this._group.model.headerPosition,location:e.api.location})}dispose(){var e;this.mutableDisposable.dispose(),(e=this._part)==null||e.dispose()}update(e){var t;(t=this._part)==null||t.update(e.params)}updatePanels(){this.update({params:{panels:this._group.model.panels}})}updateActivePanel(){this.update({params:{activePanel:this._group.model.activePanel}})}updateGroupActive(){this.update({params:{isGroupActive:this._group.api.isActive}})}updateLocation(e){this.update({params:{location:e}})}},D=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}init(e){this.part=new b(this._element,this.reactPortalStore,this.component,e)}dispose(){var e;(e=this.part)==null||e.dispose()}},O=class{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.display=`inline-flex`}init(e){this.part=new b(this._element,this.reactPortalStore,this.component,{tabGroup:e.tabGroup,api:e.api})}update(e){var t;(t=this.part)==null||t.update({tabGroup:e.tabGroup})}dispose(){var e;(e=this.part)==null||e.dispose()}},k=class{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.display=`inline-flex`}init(e){this.part=new b(this._element,this.reactPortalStore,this.component,{group:e.group,api:e.api})}dispose(){var e;(e=this.part)==null||e.dispose()}};function A(e,t){return e?n=>new E(e,t,n):void 0}const j=`props.defaultTabComponent`;function M(e){return c.PROPERTY_KEYS_DOCKVIEW.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const N=l.default.forwardRef((e,t)=>{let n=l.default.useRef(null),r=l.default.useRef(void 0),[i,a]=x();l.default.useImperativeHandle(t,()=>n.current,[]);let o=l.default.useRef({});return l.default.useEffect(()=>{let t={};c.PROPERTY_KEYS_DOCKVIEW.forEach(n=>{let r=n,i=e[r];r in e&&i!==o.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),o.current=e},c.PROPERTY_KEYS_DOCKVIEW.map(t=>e[t])),l.default.useEffect(()=>{if(!n.current)return;let t=g({},e.tabComponents);e.defaultTabComponent&&(t[j]=e.defaultTabComponent);let i={createLeftHeaderActionComponent:A(e.leftHeaderActionsComponent,{addPortal:a}),createRightHeaderActionComponent:A(e.rightHeaderActionsComponent,{addPortal:a}),createPrefixHeaderActionComponent:A(e.prefixHeaderActionsComponent,{addPortal:a}),createComponent:t=>new C(t.id,e.components[t.name],{addPortal:a}),createTabComponent(e){return new w(e.id,t[e.name],{addPortal:a})},createWatermarkComponent:e.watermarkComponent?()=>new T(`watermark`,e.watermarkComponent,{addPortal:a}):void 0,defaultTabComponent:e.defaultTabComponent?j:void 0,createContextMenuItemComponent:e=>{if(e.component)return new D(e.id,e.component,{addPortal:a})}},o=M(e);if(e.tabGroupChipComponent){let t=e.tabGroupChipComponent;o.createTabGroupChipComponent=()=>new O(t,{addPortal:a})}if(e.groupDragGhostComponent){let t=e.groupDragGhostComponent;o.createGroupDragGhostComponent=()=>new k(t,{addPortal:a})}let s=(0,c.createDockview)(n.current,g(g({},o),i)),{clientWidth:l,clientHeight:u}=n.current;return s.layout(l,u),e.onReady&&e.onReady({api:s}),r.current=s,()=>{r.current=void 0,s.dispose()}},[]),l.default.useEffect(()=>{if(!r.current)return()=>{};let t=r.current.onDidDrop(t=>{e.onDidDrop&&e.onDidDrop(t)});return()=>{t.dispose()}},[e.onDidDrop]),l.default.useEffect(()=>{if(!r.current)return()=>{};let t=r.current.onWillDrop(t=>{e.onWillDrop&&e.onWillDrop(t)});return()=>{t.dispose()}},[e.onWillDrop]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createTabGroupChipComponent:e.tabGroupChipComponent?()=>new O(e.tabGroupChipComponent,{addPortal:a}):void 0})},[e.tabGroupChipComponent]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createGroupDragGhostComponent:e.groupDragGhostComponent?()=>new k(e.groupDragGhostComponent,{addPortal:a}):void 0})},[e.groupDragGhostComponent]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new C(t.id,e.components[t.name],{addPortal:a})})},[e.components]),l.default.useEffect(()=>{if(!r.current)return;let t=g({},e.tabComponents);e.defaultTabComponent&&(t[j]=e.defaultTabComponent),r.current.updateOptions({defaultTabComponent:e.defaultTabComponent?j:void 0,createTabComponent(e){return new w(e.id,t[e.name],{addPortal:a})}})},[e.tabComponents,e.defaultTabComponent]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createWatermarkComponent:e.watermarkComponent?()=>new T(`watermark`,e.watermarkComponent,{addPortal:a}):void 0})},[e.watermarkComponent]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createRightHeaderActionComponent:A(e.rightHeaderActionsComponent,{addPortal:a})})},[e.rightHeaderActionsComponent]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createLeftHeaderActionComponent:A(e.leftHeaderActionsComponent,{addPortal:a})})},[e.leftHeaderActionsComponent]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createPrefixHeaderActionComponent:A(e.prefixHeaderActionsComponent,{addPortal:a})})},[e.prefixHeaderActionsComponent]),l.default.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});N.displayName=`DockviewComponent`;const P=()=>l.default.createElement(`svg`,{height:`11`,width:`11`,viewBox:`0 0 28 28`,"aria-hidden":`false`,focusable:!1,className:`dv-svg`},l.default.createElement(`path`,{d:`M2.1 27.3L0 25.2L11.55 13.65L0 2.1L2.1 0L13.65 11.55L25.2 0L27.3 2.1L15.75 13.65L27.3 25.2L25.2 27.3L13.65 15.75L2.1 27.3Z`})),F=()=>l.default.createElement(`svg`,{height:`11`,width:`11`,viewBox:`0 0 24 24`,"aria-hidden":`false`,focusable:!1,className:`dv-svg`},l.default.createElement(`path`,{d:`M16 9V4h1c.55 0 1-.45 1-1s-.45-1-1-1H6c-.55 0-1 .45-1 1s.45 1 1 1h1v5c0 1.66-1.34 3-3 3v2h5.97v7l1 1 1-1v-7H19v-2c-1.66 0-3-1.34-3-3z`}));function I(e,t){if(e==null)return{};var n={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(t.includes(r))continue;n[r]=e[r]}return n}function L(e,t){if(e==null)return{};var n,r,i=I(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.includes(n)||{}.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}const R=[`api`,`containerApi`,`params`,`hideClose`,`closeActionOverride`,`onPointerDown`,`onPointerUp`,`onPointerLeave`,`tabLocation`];function z(e){let[t,n]=l.default.useState(e.title);return l.default.useEffect(()=>{let r=e.onDidTitleChange(e=>{n(e.title)});return t!==e.title&&n(e.title),()=>{r.dispose()}},[e]),t}function B(e){let[t,n]=l.default.useState(e.isPinned);return l.default.useEffect(()=>{let r=e.onDidChangePinned(e=>{n(e.isPinned)});return t!==e.isPinned&&n(e.isPinned),()=>{r.dispose()}},[e]),t}const V=e=>{let{api:t,containerApi:n,params:r,hideClose:i,closeActionOverride:a,onPointerDown:o,onPointerUp:s,onPointerLeave:c,tabLocation:u}=e,d=L(e,R),f=z(t),p=B(t),m=l.default.useRef(!1),h=l.default.useCallback(e=>{e.preventDefault(),a?a():t.close()},[t,a]),_=l.default.useCallback(e=>{e.preventDefault()},[]),v=l.default.useCallback(e=>{m.current=e.button===1,o==null||o(e)},[o]),y=l.default.useCallback(e=>{m.current&&e.button===1&&!i&&(m.current=!1,h(e)),s==null||s(e)},[s,h,i]),b=l.default.useCallback(e=>{m.current=!1,c==null||c(e)},[c]);return l.default.createElement(`div`,g(g({"data-testid":`dockview-dv-default-tab`},d),{},{onPointerDown:v,onPointerUp:y,onPointerLeave:b,className:`dv-default-tab`}),p&&l.default.createElement(`div`,{className:`dv-tab-pin`},l.default.createElement(F,null)),l.default.createElement(`span`,{className:`dv-default-tab-content`},f),!i&&l.default.createElement(`button`,{type:`button`,className:`dv-default-tab-action`,"aria-label":`Close tab`,onPointerDown:_,onClick:h},l.default.createElement(P,null)))};var H=class extends c.SplitviewPanel{constructor(e,t,n,r){super(e,t),this.reactComponent=n,this.reactPortalStore=r}getComponent(){var e,t;return new b(this.element,this.reactPortalStore,this.reactComponent,{params:(e=(t=this._params)==null?void 0:t.params)==null?{}:e,api:this.api,containerApi:new c.SplitviewApi(this._params.accessor)})}};function U(e){return c.PROPERTY_KEYS_SPLITVIEW.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const W=l.default.forwardRef((e,t)=>{let n=l.default.useRef(null),r=l.default.useRef(void 0),[i,a]=x();l.default.useImperativeHandle(t,()=>n.current,[]);let o=l.default.useRef({});return l.default.useEffect(()=>{let t={};c.PROPERTY_KEYS_SPLITVIEW.forEach(n=>{let r=n,i=e[r];r in e&&i!==o.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),o.current=e},c.PROPERTY_KEYS_SPLITVIEW.map(t=>e[t])),l.default.useEffect(()=>{if(!n.current)return()=>{};let t=(0,c.createSplitview)(n.current,g(g({},U(e)),{createComponent:t=>new H(t.id,t.name,e.components[t.name],{addPortal:a})})),{clientWidth:i,clientHeight:o}=n.current;return t.layout(i,o),e.onReady&&e.onReady({api:t}),r.current=t,()=>{r.current=void 0,t.dispose()}},[]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new H(t.id,t.name,e.components[t.name],{addPortal:a})})},[e.components]),l.default.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});W.displayName=`SplitviewComponent`;var G=class extends c.GridviewPanel{constructor(e,t,n,r){super(e,t),this.reactComponent=n,this.reactPortalStore=r}getComponent(){var e,t;return new b(this.element,this.reactPortalStore,this.reactComponent,{params:(e=(t=this._params)==null?void 0:t.params)==null?{}:e,api:this.api,containerApi:new c.GridviewApi(this._params.accessor)})}};function K(e){return c.PROPERTY_KEYS_GRIDVIEW.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const q=l.default.forwardRef((e,t)=>{let n=l.default.useRef(null),r=l.default.useRef(void 0),[i,a]=x();l.default.useImperativeHandle(t,()=>n.current,[]);let o=l.default.useRef({});return l.default.useEffect(()=>{let t={};c.PROPERTY_KEYS_GRIDVIEW.forEach(n=>{let r=n,i=e[r];r in e&&i!==o.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),o.current=e},c.PROPERTY_KEYS_GRIDVIEW.map(t=>e[t])),l.default.useEffect(()=>{if(!n.current)return()=>{};let t=(0,c.createGridview)(n.current,g(g({},K(e)),{createComponent:t=>new G(t.id,t.name,e.components[t.name],{addPortal:a})})),{clientWidth:i,clientHeight:o}=n.current;return t.layout(i,o),e.onReady&&e.onReady({api:t}),r.current=t,()=>{r.current=void 0,t.dispose()}},[]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new G(t.id,t.name,e.components[t.name],{addPortal:a})})},[e.components]),l.default.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});q.displayName=`GridviewComponent`;var J=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.style.height=`100%`,this._element.style.width=`100%`}init(e){this.part=new b(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,title:e.title,containerApi:e.containerApi})}toJSON(){return{id:this.id}}update(e){var t;(t=this.part)==null||t.update(e.params)}dispose(){var e;(e=this.part)==null||e.dispose()}};function Y(e){return c.PROPERTY_KEYS_PANEVIEW.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const X=l.default.forwardRef((e,t)=>{let n=l.default.useRef(null),r=l.default.useRef(void 0),[i,a]=x();l.default.useImperativeHandle(t,()=>n.current,[]);let o=l.default.useRef({});return l.default.useEffect(()=>{let t={};c.PROPERTY_KEYS_PANEVIEW.forEach(n=>{let r=n,i=e[r];r in e&&i!==o.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),o.current=e},c.PROPERTY_KEYS_PANEVIEW.map(t=>e[t])),l.default.useEffect(()=>{var t;if(!n.current)return()=>{};let i=(t=e.headerComponents)==null?{}:t,o=(0,c.createPaneview)(n.current,g(g({},Y(e)),{createComponent:t=>new J(t.id,e.components[t.name],{addPortal:a}),createHeaderComponent:e=>new J(e.id,i[e.name],{addPortal:a})})),{clientWidth:s,clientHeight:l}=n.current;return o.layout(s,l),e.onReady&&e.onReady({api:o}),r.current=o,()=>{r.current=void 0,o.dispose()}},[]),l.default.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new J(t.id,e.components[t.name],{addPortal:a})})},[e.components]),l.default.useEffect(()=>{var t;if(!r.current)return;let n=(t=e.headerComponents)==null?{}:t;r.current.updateOptions({createHeaderComponent:e=>new J(e.id,n[e.name],{addPortal:a})})},[e.headerComponents]),l.default.useEffect(()=>{if(!r.current)return()=>{};let t=r.current.onDidDrop(t=>{e.onDidDrop&&e.onDidDrop(t)});return()=>{t.dispose()}},[e.onDidDrop]),l.default.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});X.displayName=`PaneviewComponent`,exports.DockviewDefaultTab=V,exports.DockviewReact=N,exports.GridviewReact=q,exports.PaneviewReact=X,exports.ReactPart=b,exports.ReactPartContext=y,exports.SplitviewReact=W,exports.isReactComponent=S,exports.usePortalsLifecycle=x,Object.keys(c).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return c[e]}})});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
import{DockviewDisposable as e,DockviewEmitter as t,DockviewMutableDisposable as n,DockviewCompositeDisposable as o,PROPERTY_KEYS_DOCKVIEW as r,createDockview as a,SplitviewPanel as i,SplitviewApi as s,PROPERTY_KEYS_SPLITVIEW as c,createSplitview as p,GridviewPanel as l,GridviewApi as d,PROPERTY_KEYS_GRIDVIEW as u,createGridview as m,PROPERTY_KEYS_PANEVIEW as h,createPaneview as f}from"dockview";export*from"dockview";import v from"react";import C from"react-dom";const P=(e,t)=>{const[,n]=v.useState(0),o=v.useRef(e.componentProps);return v.useImperativeHandle(t,()=>({update:e=>{o.current=Object.assign(Object.assign({},o.current),e),n(e=>e+1)}}),[]),v.createElement(e.component,o.current)};P.displayName="DockviewReactJsBridge";const g=(()=>{let e=1;return{next:()=>`dockview_react_portal_key_${(e++).toString()}`}})(),w=v.createContext({});class _{constructor(e,t,n,o,r){this.parent=e,this.portalStore=t,this.component=n,this.parameters=o,this.context=r,this._initialProps={},this.disposed=!1,this.createPortal()}update(e){if(this.disposed)throw new Error("invalid operation: resource is already disposed");this.componentInstance?this.componentInstance.update(e):this._initialProps=Object.assign(Object.assign({},this._initialProps),e)}createPortal(){if(this.disposed)throw new Error("invalid operation: resource is already disposed");if(!y(this.component))throw new Error("Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components");const e=v.createElement(v.forwardRef(P),{component:this.component,componentProps:this.parameters,ref:e=>{this.componentInstance=e,Object.keys(this._initialProps).length>0&&(this.componentInstance.update(this._initialProps),this._initialProps={})}}),t=this.context?v.createElement(w.Provider,{value:this.context},e):e,n=C.createPortal(t,this.parent,g.next());this.ref={portal:n,disposable:this.portalStore.addPortal(n)}}dispose(){var e;null===(e=this.ref)||void 0===e||e.disposable.dispose(),this.disposed=!0}}const b=()=>{const[t,n]=v.useState([]);v.useDebugValue(`Portal count: ${t.length}`);return[t,v.useCallback(t=>{n(e=>[...e,t]);let o=!1;return e.from(()=>{if(o)throw new Error("invalid operation: resource already disposed");o=!0,n(e=>e.filter(e=>e!==t))})},[])]};function y(e){return"function"==typeof e||!!(null==e?void 0:e.$$typeof)}class E{get element(){return this._element}constructor(e,n,o){this.id=e,this.component=n,this.reactPortalStore=o,this._onDidFocus=new t,this.onDidFocus=this._onDidFocus.event,this._onDidBlur=new t,this.onDidBlur=this._onDidBlur.event,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}focus(){}init(e){this.part=new _(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi})}update(e){var t;null===(t=this.part)||void 0===t||t.update({params:e.params})}layout(e,t){}dispose(){var e;this._onDidFocus.dispose(),this._onDidBlur.dispose(),null===(e=this.part)||void 0===e||e.dispose()}}class D{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}focus(){}init(e){this.part=new _(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi,tabLocation:e.tabLocation})}update(e){var t;null===(t=this.part)||void 0===t||t.update({params:e.params})}layout(e,t){}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class O{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}init(e){this.part=new _(this.element,this.reactPortalStore,this.component,{group:e.group,containerApi:e.containerApi})}focus(){}update(e){var t,n,o;this.parameters&&(this.parameters.params=e.params),null===(t=this.part)||void 0===t||t.update({params:null!==(o=null===(n=this.parameters)||void 0===n?void 0:n.params)&&void 0!==o?o:{}})}layout(e,t){}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class A{get element(){return this._element}get part(){return this._part}constructor(e,t,o){this.component=e,this.reactPortalStore=t,this._group=o,this.mutableDisposable=new n,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}init(e){this.mutableDisposable.value=new o(this._group.model.onDidAddPanel(()=>{this.updatePanels()}),this._group.model.onDidRemovePanel(()=>{this.updatePanels()}),this._group.model.onDidActivePanelChange(()=>{this.updateActivePanel()}),e.api.onDidActiveChange(()=>{this.updateGroupActive()}),e.api.onDidLocationChange(e=>{this.updateLocation(e.location)})),this._part=new _(this.element,this.reactPortalStore,this.component,{api:e.api,containerApi:e.containerApi,panels:this._group.model.panels,activePanel:this._group.model.activePanel,isGroupActive:this._group.api.isActive,group:this._group,headerPosition:this._group.model.headerPosition,location:e.api.location})}dispose(){var e;this.mutableDisposable.dispose(),null===(e=this._part)||void 0===e||e.dispose()}update(e){var t;null===(t=this._part)||void 0===t||t.update(e.params)}updatePanels(){this.update({params:{panels:this._group.model.panels}})}updateActivePanel(){this.update({params:{activePanel:this._group.model.activePanel}})}updateGroupActive(){this.update({params:{isGroupActive:this._group.api.isActive}})}updateLocation(e){this.update({params:{location:e}})}}class R{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.height="100%",this._element.style.width="100%"}init(e){this.part=new _(this._element,this.reactPortalStore,this.component,e)}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class S{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.display="inline-flex"}init(e){this.part=new _(this._element,this.reactPortalStore,this.component,{tabGroup:e.tabGroup,api:e.api})}update(e){var t;null===(t=this.part)||void 0===t||t.update({tabGroup:e.tabGroup})}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}class H{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement("div"),this._element.className="dv-react-part",this._element.style.display="inline-flex"}init(e){this.part=new _(this._element,this.reactPortalStore,this.component,{group:e.group,api:e.api})}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}function k(e,t){return e?n=>new A(e,t,n):void 0}const G="props.defaultTabComponent";const L=v.forwardRef((e,t)=>{const n=v.useRef(null),o=v.useRef(void 0),[i,s]=b();v.useImperativeHandle(t,()=>n.current,[]);const c=v.useRef({});return v.useEffect(()=>{const t={};r.forEach(n=>{const o=n,r=e[o];o in e&&r!==c.current[o]&&(t[o]=r)}),o.current&&o.current.updateOptions(t),c.current=e},r.map(t=>e[t])),v.useEffect(()=>{var t;if(!n.current)return;const i=null!==(t=e.tabComponents)&&void 0!==t?t:{};e.defaultTabComponent&&(i[G]=e.defaultTabComponent);const c={createLeftHeaderActionComponent:k(e.leftHeaderActionsComponent,{addPortal:s}),createRightHeaderActionComponent:k(e.rightHeaderActionsComponent,{addPortal:s}),createPrefixHeaderActionComponent:k(e.prefixHeaderActionsComponent,{addPortal:s}),createComponent:t=>new E(t.id,e.components[t.name],{addPortal:s}),createTabComponent:e=>new D(e.id,i[e.name],{addPortal:s}),createWatermarkComponent:e.watermarkComponent?()=>new O("watermark",e.watermarkComponent,{addPortal:s}):void 0,defaultTabComponent:e.defaultTabComponent?G:void 0,createContextMenuItemComponent:e=>{if(e.component)return new R(e.id,e.component,{addPortal:s})}},p=function(e){return r.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}(e);if(e.tabGroupChipComponent){const t=e.tabGroupChipComponent;p.createTabGroupChipComponent=()=>new S(t,{addPortal:s})}if(e.groupDragGhostComponent){const t=e.groupDragGhostComponent;p.createGroupDragGhostComponent=()=>new H(t,{addPortal:s})}const l=a(n.current,Object.assign(Object.assign({},p),c)),{clientWidth:d,clientHeight:u}=n.current;return l.layout(d,u),e.onReady&&e.onReady({api:l}),o.current=l,()=>{o.current=void 0,l.dispose()}},[]),v.useEffect(()=>{if(!o.current)return()=>{};const t=o.current.onDidDrop(t=>{e.onDidDrop&&e.onDidDrop(t)});return()=>{t.dispose()}},[e.onDidDrop]),v.useEffect(()=>{if(!o.current)return()=>{};const t=o.current.onWillDrop(t=>{e.onWillDrop&&e.onWillDrop(t)});return()=>{t.dispose()}},[e.onWillDrop]),v.useEffect(()=>{o.current&&o.current.updateOptions({createTabGroupChipComponent:e.tabGroupChipComponent?()=>new S(e.tabGroupChipComponent,{addPortal:s}):void 0})},[e.tabGroupChipComponent]),v.useEffect(()=>{o.current&&o.current.updateOptions({createGroupDragGhostComponent:e.groupDragGhostComponent?()=>new H(e.groupDragGhostComponent,{addPortal:s}):void 0})},[e.groupDragGhostComponent]),v.useEffect(()=>{o.current&&o.current.updateOptions({createComponent:t=>new E(t.id,e.components[t.name],{addPortal:s})})},[e.components]),v.useEffect(()=>{var t;if(!o.current)return;const n=null!==(t=e.tabComponents)&&void 0!==t?t:{};e.defaultTabComponent&&(n[G]=e.defaultTabComponent),o.current.updateOptions({defaultTabComponent:e.defaultTabComponent?G:void 0,createTabComponent:e=>new D(e.id,n[e.name],{addPortal:s})})},[e.tabComponents,e.defaultTabComponent]),v.useEffect(()=>{o.current&&o.current.updateOptions({createWatermarkComponent:e.watermarkComponent?()=>new O("watermark",e.watermarkComponent,{addPortal:s}):void 0})},[e.watermarkComponent]),v.useEffect(()=>{o.current&&o.current.updateOptions({createRightHeaderActionComponent:k(e.rightHeaderActionsComponent,{addPortal:s})})},[e.rightHeaderActionsComponent]),v.useEffect(()=>{o.current&&o.current.updateOptions({createLeftHeaderActionComponent:k(e.leftHeaderActionsComponent,{addPortal:s})})},[e.leftHeaderActionsComponent]),v.useEffect(()=>{o.current&&o.current.updateOptions({createPrefixHeaderActionComponent:k(e.prefixHeaderActionsComponent,{addPortal:s})})},[e.prefixHeaderActionsComponent]),v.createElement("div",{style:{height:"100%",width:"100%"},ref:n},i)});L.displayName="DockviewComponent","function"==typeof SuppressedError&&SuppressedError;const x=()=>v.createElement("svg",{height:"11",width:"11",viewBox:"0 0 28 28","aria-hidden":"false",focusable:!1,className:"dv-svg"},v.createElement("path",{d:"M2.1 27.3L0 25.2L11.55 13.65L0 2.1L2.1 0L13.65 11.55L25.2 0L27.3 2.1L15.75 13.65L27.3 25.2L25.2 27.3L13.65 15.75L2.1 27.3Z"}));const j=e=>{var{api:t,containerApi:n,params:o,hideClose:r,closeActionOverride:a,onPointerDown:i,onPointerUp:s,onPointerLeave:c,tabLocation:p}=e,l=function(e,t){var n={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(o=Object.getOwnPropertySymbols(e);r<o.length;r++)t.indexOf(o[r])<0&&Object.prototype.propertyIsEnumerable.call(e,o[r])&&(n[o[r]]=e[o[r]])}return n}(e,["api","containerApi","params","hideClose","closeActionOverride","onPointerDown","onPointerUp","onPointerLeave","tabLocation"]);const d=function(e){const[t,n]=v.useState(e.title);return v.useEffect(()=>{const o=e.onDidTitleChange(e=>{n(e.title)});return t!==e.title&&n(e.title),()=>{o.dispose()}},[e]),t}(t),u=v.useRef(!1),m=v.useCallback(e=>{e.preventDefault(),a?a():t.close()},[t,a]),h=v.useCallback(e=>{e.preventDefault()},[]),f=v.useCallback(e=>{u.current=1===e.button,null==i||i(e)},[i]),C=v.useCallback(e=>{u&&1===e.button&&!r&&(u.current=!1,m(e)),null==s||s(e)},[s,m,r]),P=v.useCallback(e=>{u.current=!1,null==c||c(e)},[c]);return v.createElement("div",Object.assign({"data-testid":"dockview-dv-default-tab"},l,{onPointerDown:f,onPointerUp:C,onPointerLeave:P,className:"dv-default-tab"}),v.createElement("span",{className:"dv-default-tab-content"},d),!r&&v.createElement("div",{className:"dv-default-tab-action",onPointerDown:h,onClick:m},v.createElement(x,null)))};class N extends i{constructor(e,t,n,o){super(e,t),this.reactComponent=n,this.reactPortalStore=o}getComponent(){var e,t;return new _(this.element,this.reactPortalStore,this.reactComponent,{params:null!==(t=null===(e=this._params)||void 0===e?void 0:e.params)&&void 0!==t?t:{},api:this.api,containerApi:new s(this._params.accessor)})}}const T=v.forwardRef((e,t)=>{const n=v.useRef(null),o=v.useRef(void 0),[r,a]=b();v.useImperativeHandle(t,()=>n.current,[]);const i=v.useRef({});return v.useEffect(()=>{const t={};c.forEach(n=>{const o=n,r=e[o];o in e&&r!==i.current[o]&&(t[o]=r)}),o.current&&o.current.updateOptions(t),i.current=e},c.map(t=>e[t])),v.useEffect(()=>{if(!n.current)return()=>{};const t={createComponent:t=>new N(t.id,t.name,e.components[t.name],{addPortal:a})},r=p(n.current,Object.assign(Object.assign({},function(e){return c.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}(e)),t)),{clientWidth:i,clientHeight:s}=n.current;return r.layout(i,s),e.onReady&&e.onReady({api:r}),o.current=r,()=>{o.current=void 0,r.dispose()}},[]),v.useEffect(()=>{o.current&&o.current.updateOptions({createComponent:t=>new N(t.id,t.name,e.components[t.name],{addPortal:a})})},[e.components]),v.createElement("div",{style:{height:"100%",width:"100%"},ref:n},r)});T.displayName="SplitviewComponent";class I extends l{constructor(e,t,n,o){super(e,t),this.reactComponent=n,this.reactPortalStore=o}getComponent(){var e,t;return new _(this.element,this.reactPortalStore,this.reactComponent,{params:null!==(t=null===(e=this._params)||void 0===e?void 0:e.params)&&void 0!==t?t:{},api:this.api,containerApi:new d(this._params.accessor)})}}const W=v.forwardRef((e,t)=>{const n=v.useRef(null),o=v.useRef(void 0),[r,a]=b();v.useImperativeHandle(t,()=>n.current,[]);const i=v.useRef({});return v.useEffect(()=>{const t={};u.forEach(n=>{const o=n,r=e[o];o in e&&r!==i.current[o]&&(t[o]=r)}),o.current&&o.current.updateOptions(t),i.current=e},u.map(t=>e[t])),v.useEffect(()=>{if(!n.current)return()=>{};const t={createComponent:t=>new I(t.id,t.name,e.components[t.name],{addPortal:a})},r=m(n.current,Object.assign(Object.assign({},function(e){return u.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}(e)),t)),{clientWidth:i,clientHeight:s}=n.current;return r.layout(i,s),e.onReady&&e.onReady({api:r}),o.current=r,()=>{o.current=void 0,r.dispose()}},[]),v.useEffect(()=>{o.current&&o.current.updateOptions({createComponent:t=>new I(t.id,t.name,e.components[t.name],{addPortal:a})})},[e.components]),v.createElement("div",{style:{height:"100%",width:"100%"},ref:n},r)});W.displayName="GridviewComponent";class B{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement("div"),this._element.style.height="100%",this._element.style.width="100%"}init(e){this.part=new _(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,title:e.title,containerApi:e.containerApi})}toJSON(){return{id:this.id}}update(e){var t;null===(t=this.part)||void 0===t||t.update(e.params)}dispose(){var e;null===(e=this.part)||void 0===e||e.dispose()}}const F=v.forwardRef((e,t)=>{const n=v.useRef(null),o=v.useRef(void 0),[r,a]=b();v.useImperativeHandle(t,()=>n.current,[]);const i=v.useRef({});return v.useEffect(()=>{const t={};h.forEach(n=>{const o=n,r=e[o];o in e&&r!==i.current[o]&&(t[o]=r)}),o.current&&o.current.updateOptions(t),i.current=e},h.map(t=>e[t])),v.useEffect(()=>{var t;if(!n.current)return()=>{};const r=null!==(t=e.headerComponents)&&void 0!==t?t:{},i={createComponent:t=>new B(t.id,e.components[t.name],{addPortal:a}),createHeaderComponent:e=>new B(e.id,r[e.name],{addPortal:a})},s=f(n.current,Object.assign(Object.assign({},function(e){return h.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}(e)),i)),{clientWidth:c,clientHeight:p}=n.current;return s.layout(c,p),e.onReady&&e.onReady({api:s}),o.current=s,()=>{o.current=void 0,s.dispose()}},[]),v.useEffect(()=>{o.current&&o.current.updateOptions({createComponent:t=>new B(t.id,e.components[t.name],{addPortal:a})})},[e.components]),v.useEffect(()=>{var t;if(!o.current)return;const n=null!==(t=e.headerComponents)&&void 0!==t?t:{};o.current.updateOptions({createHeaderComponent:e=>new B(e.id,n[e.name],{addPortal:a})})},[e.headerComponents]),v.useEffect(()=>{if(!o.current)return()=>{};const t=o.current.onDidDrop(t=>{e.onDidDrop&&e.onDidDrop(t)});return()=>{t.dispose()}},[e.onDidDrop]),v.createElement("div",{style:{height:"100%",width:"100%"},ref:n},r)});F.displayName="PaneviewComponent";export{j as DockviewDefaultTab,L as DockviewReact,W as GridviewReact,F as PaneviewReact,_ as ReactPart,w as ReactPartContext,T as SplitviewReact,y as isReactComponent,b as usePortalsLifecycle};
|
|
2
|
+
* dockview-react
|
|
3
|
+
* @version 8.1.0
|
|
4
|
+
* @link https://github.com/dockview/dockview
|
|
5
|
+
* @license MIT
|
|
6
|
+
*/
|
|
7
|
+
import{DockviewCompositeDisposable as e,DockviewDisposable as t,DockviewEmitter as n,DockviewMutableDisposable as r,GridviewApi as i,GridviewPanel as a,PROPERTY_KEYS_DOCKVIEW as o,PROPERTY_KEYS_GRIDVIEW as s,PROPERTY_KEYS_PANEVIEW as c,PROPERTY_KEYS_SPLITVIEW as l,SplitviewApi as u,SplitviewPanel as d,createDockview as f,createGridview as p,createPaneview as m,createSplitview as h}from"dockview";import g from"react";import _ from"react-dom";export*from"dockview";function v(e){"@babel/helpers - typeof";return v=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},v(e)}function y(e,t){if(v(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(v(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function ee(e){var t=y(e,`string`);return v(t)==`symbol`?t:t+``}function b(e,t,n){return(t=ee(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function x(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,r)}return n}function S(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]==null?{}:arguments[t];t%2?x(Object(n),!0).forEach(function(t){b(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):x(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}const C=(e,t)=>{let[,n]=g.useState(0),r=g.useRef(e.componentProps);return g.useImperativeHandle(t,()=>({update:e=>{r.current=S(S({},r.current),e),n(e=>e+1)}}),[]),g.createElement(e.component,r.current)};C.displayName=`DockviewReactJsBridge`;const te=(()=>{let e=1;return{next:()=>`dockview_react_portal_key_${(e++).toString()}`}})(),w=g.createContext({});var T=class{constructor(e,t,n,r,i){this.parent=e,this.portalStore=t,this.component=n,this.parameters=r,this.context=i,this._initialProps={},this.disposed=!1,this.createPortal()}update(e){if(this.disposed)throw Error(`invalid operation: resource is already disposed`);this.componentInstance?this.componentInstance.update(e):this._initialProps=S(S({},this._initialProps),e)}createPortal(){if(this.disposed)throw Error(`invalid operation: resource is already disposed`);if(!D(this.component))throw Error(`Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components`);let e=g.createElement(g.forwardRef(C),{component:this.component,componentProps:this.parameters,ref:e=>{this.componentInstance=e,Object.keys(this._initialProps).length>0&&(this.componentInstance.update(this._initialProps),this._initialProps={})}}),t=this.context?g.createElement(w.Provider,{value:this.context},e):e,n=_.createPortal(t,this.parent,te.next());this.ref={portal:n,disposable:this.portalStore.addPortal(n)}}dispose(){var e;(e=this.ref)==null||e.disposable.dispose(),this.disposed=!0}};const E=()=>{let[e,n]=g.useState([]);return g.useDebugValue(`Portal count: ${e.length}`),[e,g.useCallback(e=>{n(t=>[...t,e]);let r=!1;return t.from(()=>{if(r)throw Error(`invalid operation: resource already disposed`);r=!0,n(t=>t.filter(t=>t!==e))})},[])]};function D(e){return typeof e==`function`||!!(e!=null&&e.$$typeof)}var O=class{get element(){return this._element}constructor(e,t,r){this.id=e,this.component=t,this.reactPortalStore=r,this._onDidFocus=new n,this.onDidFocus=this._onDidFocus.event,this._onDidBlur=new n,this.onDidBlur=this._onDidBlur.event,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}focus(){}init(e){this.part=new T(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi})}update(e){var t;(t=this.part)==null||t.update({params:e.params})}layout(e,t){}dispose(){var e;this._onDidFocus.dispose(),this._onDidBlur.dispose(),(e=this.part)==null||e.dispose()}},k=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}focus(){}init(e){this.part=new T(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,containerApi:e.containerApi,tabLocation:e.tabLocation})}update(e){var t;(t=this.part)==null||t.update({params:e.params})}layout(e,t){}dispose(){var e;(e=this.part)==null||e.dispose()}},A=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}init(e){this.part=new T(this.element,this.reactPortalStore,this.component,{group:e.group,containerApi:e.containerApi})}focus(){}update(e){var t,n,r;this.parameters&&(this.parameters.params=e.params),(t=this.part)==null||t.update({params:(n=(r=this.parameters)==null?void 0:r.params)==null?{}:n})}layout(e,t){}dispose(){var e;(e=this.part)==null||e.dispose()}},j=class{get element(){return this._element}get part(){return this._part}constructor(e,t,n){this.component=e,this.reactPortalStore=t,this._group=n,this.mutableDisposable=new r,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}init(t){this.mutableDisposable.value=new e(this._group.model.onDidAddPanel(()=>{this.updatePanels()}),this._group.model.onDidRemovePanel(()=>{this.updatePanels()}),this._group.model.onDidActivePanelChange(()=>{this.updateActivePanel()}),t.api.onDidActiveChange(()=>{this.updateGroupActive()}),t.api.onDidLocationChange(e=>{this.updateLocation(e.location)})),this._part=new T(this.element,this.reactPortalStore,this.component,{api:t.api,containerApi:t.containerApi,panels:this._group.model.panels,activePanel:this._group.model.activePanel,isGroupActive:this._group.api.isActive,group:this._group,headerPosition:this._group.model.headerPosition,location:t.api.location})}dispose(){var e;this.mutableDisposable.dispose(),(e=this._part)==null||e.dispose()}update(e){var t;(t=this._part)==null||t.update(e.params)}updatePanels(){this.update({params:{panels:this._group.model.panels}})}updateActivePanel(){this.update({params:{activePanel:this._group.model.activePanel}})}updateGroupActive(){this.update({params:{isGroupActive:this._group.api.isActive}})}updateLocation(e){this.update({params:{location:e}})}},M=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.height=`100%`,this._element.style.width=`100%`}init(e){this.part=new T(this._element,this.reactPortalStore,this.component,e)}dispose(){var e;(e=this.part)==null||e.dispose()}},N=class{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.display=`inline-flex`}init(e){this.part=new T(this._element,this.reactPortalStore,this.component,{tabGroup:e.tabGroup,api:e.api})}update(e){var t;(t=this.part)==null||t.update({tabGroup:e.tabGroup})}dispose(){var e;(e=this.part)==null||e.dispose()}},P=class{get element(){return this._element}constructor(e,t){this.component=e,this.reactPortalStore=t,this._element=document.createElement(`div`),this._element.className=`dv-react-part`,this._element.style.display=`inline-flex`}init(e){this.part=new T(this._element,this.reactPortalStore,this.component,{group:e.group,api:e.api})}dispose(){var e;(e=this.part)==null||e.dispose()}};function F(e,t){return e?n=>new j(e,t,n):void 0}const I=`props.defaultTabComponent`;function ne(e){return o.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const L=g.forwardRef((e,t)=>{let n=g.useRef(null),r=g.useRef(void 0),[i,a]=E();g.useImperativeHandle(t,()=>n.current,[]);let s=g.useRef({});return g.useEffect(()=>{let t={};o.forEach(n=>{let r=n,i=e[r];r in e&&i!==s.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),s.current=e},o.map(t=>e[t])),g.useEffect(()=>{if(!n.current)return;let t=S({},e.tabComponents);e.defaultTabComponent&&(t[I]=e.defaultTabComponent);let i={createLeftHeaderActionComponent:F(e.leftHeaderActionsComponent,{addPortal:a}),createRightHeaderActionComponent:F(e.rightHeaderActionsComponent,{addPortal:a}),createPrefixHeaderActionComponent:F(e.prefixHeaderActionsComponent,{addPortal:a}),createComponent:t=>new O(t.id,e.components[t.name],{addPortal:a}),createTabComponent(e){return new k(e.id,t[e.name],{addPortal:a})},createWatermarkComponent:e.watermarkComponent?()=>new A(`watermark`,e.watermarkComponent,{addPortal:a}):void 0,defaultTabComponent:e.defaultTabComponent?I:void 0,createContextMenuItemComponent:e=>{if(e.component)return new M(e.id,e.component,{addPortal:a})}},o=ne(e);if(e.tabGroupChipComponent){let t=e.tabGroupChipComponent;o.createTabGroupChipComponent=()=>new N(t,{addPortal:a})}if(e.groupDragGhostComponent){let t=e.groupDragGhostComponent;o.createGroupDragGhostComponent=()=>new P(t,{addPortal:a})}let s=f(n.current,S(S({},o),i)),{clientWidth:c,clientHeight:l}=n.current;return s.layout(c,l),e.onReady&&e.onReady({api:s}),r.current=s,()=>{r.current=void 0,s.dispose()}},[]),g.useEffect(()=>{if(!r.current)return()=>{};let t=r.current.onDidDrop(t=>{e.onDidDrop&&e.onDidDrop(t)});return()=>{t.dispose()}},[e.onDidDrop]),g.useEffect(()=>{if(!r.current)return()=>{};let t=r.current.onWillDrop(t=>{e.onWillDrop&&e.onWillDrop(t)});return()=>{t.dispose()}},[e.onWillDrop]),g.useEffect(()=>{r.current&&r.current.updateOptions({createTabGroupChipComponent:e.tabGroupChipComponent?()=>new N(e.tabGroupChipComponent,{addPortal:a}):void 0})},[e.tabGroupChipComponent]),g.useEffect(()=>{r.current&&r.current.updateOptions({createGroupDragGhostComponent:e.groupDragGhostComponent?()=>new P(e.groupDragGhostComponent,{addPortal:a}):void 0})},[e.groupDragGhostComponent]),g.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new O(t.id,e.components[t.name],{addPortal:a})})},[e.components]),g.useEffect(()=>{if(!r.current)return;let t=S({},e.tabComponents);e.defaultTabComponent&&(t[I]=e.defaultTabComponent),r.current.updateOptions({defaultTabComponent:e.defaultTabComponent?I:void 0,createTabComponent(e){return new k(e.id,t[e.name],{addPortal:a})}})},[e.tabComponents,e.defaultTabComponent]),g.useEffect(()=>{r.current&&r.current.updateOptions({createWatermarkComponent:e.watermarkComponent?()=>new A(`watermark`,e.watermarkComponent,{addPortal:a}):void 0})},[e.watermarkComponent]),g.useEffect(()=>{r.current&&r.current.updateOptions({createRightHeaderActionComponent:F(e.rightHeaderActionsComponent,{addPortal:a})})},[e.rightHeaderActionsComponent]),g.useEffect(()=>{r.current&&r.current.updateOptions({createLeftHeaderActionComponent:F(e.leftHeaderActionsComponent,{addPortal:a})})},[e.leftHeaderActionsComponent]),g.useEffect(()=>{r.current&&r.current.updateOptions({createPrefixHeaderActionComponent:F(e.prefixHeaderActionsComponent,{addPortal:a})})},[e.prefixHeaderActionsComponent]),g.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});L.displayName=`DockviewComponent`;const R=()=>g.createElement(`svg`,{height:`11`,width:`11`,viewBox:`0 0 28 28`,"aria-hidden":`false`,focusable:!1,className:`dv-svg`},g.createElement(`path`,{d:`M2.1 27.3L0 25.2L11.55 13.65L0 2.1L2.1 0L13.65 11.55L25.2 0L27.3 2.1L15.75 13.65L27.3 25.2L25.2 27.3L13.65 15.75L2.1 27.3Z`})),z=()=>g.createElement(`svg`,{height:`11`,width:`11`,viewBox:`0 0 24 24`,"aria-hidden":`false`,focusable:!1,className:`dv-svg`},g.createElement(`path`,{d:`M16 9V4h1c.55 0 1-.45 1-1s-.45-1-1-1H6c-.55 0-1 .45-1 1s.45 1 1 1h1v5c0 1.66-1.34 3-3 3v2h5.97v7l1 1 1-1v-7H19v-2c-1.66 0-3-1.34-3-3z`}));function B(e,t){if(e==null)return{};var n={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(t.includes(r))continue;n[r]=e[r]}return n}function V(e,t){if(e==null)return{};var n,r,i=B(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.includes(n)||{}.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}const H=[`api`,`containerApi`,`params`,`hideClose`,`closeActionOverride`,`onPointerDown`,`onPointerUp`,`onPointerLeave`,`tabLocation`];function U(e){let[t,n]=g.useState(e.title);return g.useEffect(()=>{let r=e.onDidTitleChange(e=>{n(e.title)});return t!==e.title&&n(e.title),()=>{r.dispose()}},[e]),t}function W(e){let[t,n]=g.useState(e.isPinned);return g.useEffect(()=>{let r=e.onDidChangePinned(e=>{n(e.isPinned)});return t!==e.isPinned&&n(e.isPinned),()=>{r.dispose()}},[e]),t}const G=e=>{let{api:t,containerApi:n,params:r,hideClose:i,closeActionOverride:a,onPointerDown:o,onPointerUp:s,onPointerLeave:c,tabLocation:l}=e,u=V(e,H),d=U(t),f=W(t),p=g.useRef(!1),m=g.useCallback(e=>{e.preventDefault(),a?a():t.close()},[t,a]),h=g.useCallback(e=>{e.preventDefault()},[]),_=g.useCallback(e=>{p.current=e.button===1,o==null||o(e)},[o]),v=g.useCallback(e=>{p.current&&e.button===1&&!i&&(p.current=!1,m(e)),s==null||s(e)},[s,m,i]),y=g.useCallback(e=>{p.current=!1,c==null||c(e)},[c]);return g.createElement(`div`,S(S({"data-testid":`dockview-dv-default-tab`},u),{},{onPointerDown:_,onPointerUp:v,onPointerLeave:y,className:`dv-default-tab`}),f&&g.createElement(`div`,{className:`dv-tab-pin`},g.createElement(z,null)),g.createElement(`span`,{className:`dv-default-tab-content`},d),!i&&g.createElement(`button`,{type:`button`,className:`dv-default-tab-action`,"aria-label":`Close tab`,onPointerDown:h,onClick:m},g.createElement(R,null)))};var K=class extends d{constructor(e,t,n,r){super(e,t),this.reactComponent=n,this.reactPortalStore=r}getComponent(){var e,t;return new T(this.element,this.reactPortalStore,this.reactComponent,{params:(e=(t=this._params)==null?void 0:t.params)==null?{}:e,api:this.api,containerApi:new u(this._params.accessor)})}};function q(e){return l.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const J=g.forwardRef((e,t)=>{let n=g.useRef(null),r=g.useRef(void 0),[i,a]=E();g.useImperativeHandle(t,()=>n.current,[]);let o=g.useRef({});return g.useEffect(()=>{let t={};l.forEach(n=>{let r=n,i=e[r];r in e&&i!==o.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),o.current=e},l.map(t=>e[t])),g.useEffect(()=>{if(!n.current)return()=>{};let t=h(n.current,S(S({},q(e)),{createComponent:t=>new K(t.id,t.name,e.components[t.name],{addPortal:a})})),{clientWidth:i,clientHeight:o}=n.current;return t.layout(i,o),e.onReady&&e.onReady({api:t}),r.current=t,()=>{r.current=void 0,t.dispose()}},[]),g.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new K(t.id,t.name,e.components[t.name],{addPortal:a})})},[e.components]),g.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});J.displayName=`SplitviewComponent`;var Y=class extends a{constructor(e,t,n,r){super(e,t),this.reactComponent=n,this.reactPortalStore=r}getComponent(){var e,t;return new T(this.element,this.reactPortalStore,this.reactComponent,{params:(e=(t=this._params)==null?void 0:t.params)==null?{}:e,api:this.api,containerApi:new i(this._params.accessor)})}};function X(e){return s.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const Z=g.forwardRef((e,t)=>{let n=g.useRef(null),r=g.useRef(void 0),[i,a]=E();g.useImperativeHandle(t,()=>n.current,[]);let o=g.useRef({});return g.useEffect(()=>{let t={};s.forEach(n=>{let r=n,i=e[r];r in e&&i!==o.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),o.current=e},s.map(t=>e[t])),g.useEffect(()=>{if(!n.current)return()=>{};let t=p(n.current,S(S({},X(e)),{createComponent:t=>new Y(t.id,t.name,e.components[t.name],{addPortal:a})})),{clientWidth:i,clientHeight:o}=n.current;return t.layout(i,o),e.onReady&&e.onReady({api:t}),r.current=t,()=>{r.current=void 0,t.dispose()}},[]),g.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new Y(t.id,t.name,e.components[t.name],{addPortal:a})})},[e.components]),g.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});Z.displayName=`GridviewComponent`;var Q=class{get element(){return this._element}constructor(e,t,n){this.id=e,this.component=t,this.reactPortalStore=n,this._element=document.createElement(`div`),this._element.style.height=`100%`,this._element.style.width=`100%`}init(e){this.part=new T(this.element,this.reactPortalStore,this.component,{params:e.params,api:e.api,title:e.title,containerApi:e.containerApi})}toJSON(){return{id:this.id}}update(e){var t;(t=this.part)==null||t.update(e.params)}dispose(){var e;(e=this.part)==null||e.dispose()}};function re(e){return c.reduce((t,n)=>(n in e&&(t[n]=e[n]),t),{})}const $=g.forwardRef((e,t)=>{let n=g.useRef(null),r=g.useRef(void 0),[i,a]=E();g.useImperativeHandle(t,()=>n.current,[]);let o=g.useRef({});return g.useEffect(()=>{let t={};c.forEach(n=>{let r=n,i=e[r];r in e&&i!==o.current[r]&&(t[r]=i)}),r.current&&r.current.updateOptions(t),o.current=e},c.map(t=>e[t])),g.useEffect(()=>{var t;if(!n.current)return()=>{};let i=(t=e.headerComponents)==null?{}:t,o=m(n.current,S(S({},re(e)),{createComponent:t=>new Q(t.id,e.components[t.name],{addPortal:a}),createHeaderComponent:e=>new Q(e.id,i[e.name],{addPortal:a})})),{clientWidth:s,clientHeight:c}=n.current;return o.layout(s,c),e.onReady&&e.onReady({api:o}),r.current=o,()=>{r.current=void 0,o.dispose()}},[]),g.useEffect(()=>{r.current&&r.current.updateOptions({createComponent:t=>new Q(t.id,e.components[t.name],{addPortal:a})})},[e.components]),g.useEffect(()=>{var t;if(!r.current)return;let n=(t=e.headerComponents)==null?{}:t;r.current.updateOptions({createHeaderComponent:e=>new Q(e.id,n[e.name],{addPortal:a})})},[e.headerComponents]),g.useEffect(()=>{if(!r.current)return()=>{};let t=r.current.onDidDrop(t=>{e.onDidDrop&&e.onDidDrop(t)});return()=>{t.dispose()}},[e.onDidDrop]),g.createElement(`div`,{style:{height:`100%`,width:`100%`},ref:n},i)});$.displayName=`PaneviewComponent`;export{G as DockviewDefaultTab,L as DockviewReact,Z as GridviewReact,$ as PaneviewReact,T as ReactPart,w as ReactPartContext,J as SplitviewReact,D as isReactComponent,E as usePortalsLifecycle};
|