@nocobase/client-v2 2.2.21 → 2.2.22

package/es/index.mjs

@@ -822,7 +822,7 @@ function JsItem() {
 }
 
 ctx.render(<JsItem />);
-`;class dF extends aQ.S0{render(){return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,alignItems:"center"}})}renderHiddenInConfig(){return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,alignItems:"center",opacity:.3}})}onMount(){var e;let t=this.context.resource;if(t){let e=()=>{this.applyFlow("jsSettings")};t.on("refresh",e),this._offResourceRefresh=()=>{t.off("refresh",e)}}this._mountedOnce&&(null==(e=this.context.ref)?void 0:e.current)&&this.applyFlow("jsSettings"),this._mountedOnce=!0}onUnmount(){var e,t;null==(e=(t=this)._offResourceRefresh)||e.call(t),this._offResourceRefresh=void 0}constructor(...e){super(...e),this._mountedOnce=!1}}dF.scene=aQ.s5.all,dF.define({label:(0,f.tExpr)("JS item"),sort:9998,createModelOptions:{use:"JSItemActionModel"}}),dF.registerFlow({key:"buttonSettings",title:(0,f.tExpr)("Button settings"),sort:-999,steps:{linkageRules:{use:"actionLinkageRules"}}}),dF.registerFlow({key:"jsSettings",title:(0,f.tExpr)("JavaScript settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-decorator":"FormItem","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:()=>({version:"v2",code:dk.trim()}),async handler(e,t){let{code:l,version:o}=dh(e,t);e.onRefReady(e.ref,async t=>{e.defineProperty("element",{get:()=>new f.ElementProxy(t)}),await e.runjs(l,void 0,{version:o})})}}}}),aJ.registerActionModels({JSItemActionModel:dF}),aX.registerActionModels({JSItemActionModel:dF}),dx.registerActionModels({JSItemActionModel:dF}),dS.registerActionModels({JSItemActionModel:dF});class dC extends s2.L{constructor(...e){super(...e),this.defaultProps={type:"link",title:(0,f.tExpr)("JS action"),icon:"JavaScriptOutlined"}}}dC.scene=aQ.s5.record,dC.define({label:(0,f.tExpr)("JS action"),sort:9999,createModelOptions:{use:"JSRecordActionModel"}}),dC.registerFlow({key:"clickSettings",on:"click",title:(0,f.tExpr)("Click settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:e=>({version:"v2",code:`
+`;class dF extends aQ.S0{render(){var e;return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,minWidth:this.context.flowSettingsEnabled?(null==(e=this.context.themeToken)?void 0:e.controlHeightLG)??40:void 0,alignItems:"center"}})}renderHiddenInConfig(){var e;return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,minWidth:(null==(e=this.context.themeToken)?void 0:e.controlHeightLG)??40,alignItems:"center",opacity:.3}})}onMount(){var e;let t=this.context.resource;if(t){let e=()=>{this.applyFlow("jsSettings")};t.on("refresh",e),this._offResourceRefresh=()=>{t.off("refresh",e)}}this._mountedOnce&&(null==(e=this.context.ref)?void 0:e.current)&&this.applyFlow("jsSettings"),this._mountedOnce=!0}onUnmount(){var e,t;null==(e=(t=this)._offResourceRefresh)||e.call(t),this._offResourceRefresh=void 0}constructor(...e){super(...e),this._mountedOnce=!1}}dF.scene=aQ.s5.all,dF.define({label:(0,f.tExpr)("JS item"),sort:9998,createModelOptions:{use:"JSItemActionModel"}}),dF.registerFlow({key:"buttonSettings",title:(0,f.tExpr)("Button settings"),sort:-999,steps:{linkageRules:{use:"actionLinkageRules"}}}),dF.registerFlow({key:"jsSettings",title:(0,f.tExpr)("JavaScript settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-decorator":"FormItem","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:()=>({version:"v2",code:dk.trim()}),async handler(e,t){let{code:l,version:o}=dh(e,t);e.onRefReady(e.ref,async t=>{e.defineProperty("element",{get:()=>new f.ElementProxy(t)}),await e.runjs(l,void 0,{version:o})})}}}}),aJ.registerActionModels({JSItemActionModel:dF}),aX.registerActionModels({JSItemActionModel:dF}),dx.registerActionModels({JSItemActionModel:dF}),dS.registerActionModels({JSItemActionModel:dF});class dC extends s2.L{constructor(...e){super(...e),this.defaultProps={type:"link",title:(0,f.tExpr)("JS action"),icon:"JavaScriptOutlined"}}}dC.scene=aQ.s5.record,dC.define({label:(0,f.tExpr)("JS action"),sort:9999,createModelOptions:{use:"JSRecordActionModel"}}),dC.registerFlow({key:"clickSettings",on:"click",title:(0,f.tExpr)("Click settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:e=>({version:"v2",code:`
 if (!ctx.record) {
   ctx.message.error('No record');
 } else {

package/lib/index.js

@@ -822,7 +822,7 @@ function JsItem() {
 }
 
 ctx.render(<JsItem />);
-`;class dk extends aQ.S0{render(){return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,alignItems:"center"}})}renderHiddenInConfig(){return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,alignItems:"center",opacity:.3}})}onMount(){var e;let t=this.context.resource;if(t){let e=()=>{this.applyFlow("jsSettings")};t.on("refresh",e),this._offResourceRefresh=()=>{t.off("refresh",e)}}this._mountedOnce&&(null==(e=this.context.ref)?void 0:e.current)&&this.applyFlow("jsSettings"),this._mountedOnce=!0}onUnmount(){var e,t;null==(e=(t=this)._offResourceRefresh)||e.call(t),this._offResourceRefresh=void 0}constructor(...e){super(...e),this._mountedOnce=!1}}dk.scene=aQ.s5.all,dk.define({label:(0,f.tExpr)("JS item"),sort:9998,createModelOptions:{use:"JSItemActionModel"}}),dk.registerFlow({key:"buttonSettings",title:(0,f.tExpr)("Button settings"),sort:-999,steps:{linkageRules:{use:"actionLinkageRules"}}}),dk.registerFlow({key:"jsSettings",title:(0,f.tExpr)("JavaScript settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-decorator":"FormItem","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:()=>({version:"v2",code:dF.trim()}),async handler(e,t){let{code:l,version:o}=dh(e,t);e.onRefReady(e.ref,async t=>{e.defineProperty("element",{get:()=>new f.ElementProxy(t)}),await e.runjs(l,void 0,{version:o})})}}}}),aJ.registerActionModels({JSItemActionModel:dk}),aX.registerActionModels({JSItemActionModel:dk}),dM.registerActionModels({JSItemActionModel:dk}),dw.registerActionModels({JSItemActionModel:dk});class dC extends s2.L{constructor(...e){super(...e),this.defaultProps={type:"link",title:(0,f.tExpr)("JS action"),icon:"JavaScriptOutlined"}}}dC.scene=aQ.s5.record,dC.define({label:(0,f.tExpr)("JS action"),sort:9999,createModelOptions:{use:"JSRecordActionModel"}}),dC.registerFlow({key:"clickSettings",on:"click",title:(0,f.tExpr)("Click settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:e=>({version:"v2",code:`
+`;class dk extends aQ.S0{render(){var e;return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,minWidth:this.context.flowSettingsEnabled?(null==(e=this.context.themeToken)?void 0:e.controlHeightLG)??40:void 0,alignItems:"center"}})}renderHiddenInConfig(){var e;return(0,m.jsx)("div",{ref:this.context.ref,style:{display:"inline-flex",minHeight:22,minWidth:(null==(e=this.context.themeToken)?void 0:e.controlHeightLG)??40,alignItems:"center",opacity:.3}})}onMount(){var e;let t=this.context.resource;if(t){let e=()=>{this.applyFlow("jsSettings")};t.on("refresh",e),this._offResourceRefresh=()=>{t.off("refresh",e)}}this._mountedOnce&&(null==(e=this.context.ref)?void 0:e.current)&&this.applyFlow("jsSettings"),this._mountedOnce=!0}onUnmount(){var e,t;null==(e=(t=this)._offResourceRefresh)||e.call(t),this._offResourceRefresh=void 0}constructor(...e){super(...e),this._mountedOnce=!1}}dk.scene=aQ.s5.all,dk.define({label:(0,f.tExpr)("JS item"),sort:9998,createModelOptions:{use:"JSItemActionModel"}}),dk.registerFlow({key:"buttonSettings",title:(0,f.tExpr)("Button settings"),sort:-999,steps:{linkageRules:{use:"actionLinkageRules"}}}),dk.registerFlow({key:"jsSettings",title:(0,f.tExpr)("JavaScript settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-decorator":"FormItem","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:()=>({version:"v2",code:dF.trim()}),async handler(e,t){let{code:l,version:o}=dh(e,t);e.onRefReady(e.ref,async t=>{e.defineProperty("element",{get:()=>new f.ElementProxy(t)}),await e.runjs(l,void 0,{version:o})})}}}}),aJ.registerActionModels({JSItemActionModel:dk}),aX.registerActionModels({JSItemActionModel:dk}),dM.registerActionModels({JSItemActionModel:dk}),dw.registerActionModels({JSItemActionModel:dk});class dC extends s2.L{constructor(...e){super(...e),this.defaultProps={type:"link",title:(0,f.tExpr)("JS action"),icon:"JavaScriptOutlined"}}}dC.scene=aQ.s5.record,dC.define({label:(0,f.tExpr)("JS action"),sort:9999,createModelOptions:{use:"JSRecordActionModel"}}),dC.registerFlow({key:"clickSettings",on:"click",title:(0,f.tExpr)("Click settings"),steps:{runJs:{title:(0,f.tExpr)("Write JavaScript"),useRawParams:!0,uiSchema:{code:{type:"string","x-component":dm.BY,"x-component-props":{minHeight:"320px",theme:"light",enableLinter:!0,wrapperStyle:{position:"fixed",inset:8}}}},uiMode:{type:"embed",props:{styles:{body:{transform:"translateX(0)"}}}},defaultParams:e=>({version:"v2",code:`
 if (!ctx.record) {
   ctx.message.error('No record');
 } else {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/client-v2",
-  "version": "2.2.21",
+  "version": "2.2.22",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.mjs",
@@ -27,11 +27,11 @@
     "@formily/antd-v5": "1.2.3",
     "@formily/react": "^2.2.27",
     "@formily/shared": "^2.2.27",
-    "@nocobase/evaluators": "2.2.21",
-    "@nocobase/flow-engine": "2.2.21",
-    "@nocobase/sdk": "2.2.21",
-    "@nocobase/shared": "2.2.21",
-    "@nocobase/utils": "2.2.21",
+    "@nocobase/evaluators": "2.2.22",
+    "@nocobase/flow-engine": "2.2.22",
+    "@nocobase/sdk": "2.2.22",
+    "@nocobase/shared": "2.2.22",
+    "@nocobase/utils": "2.2.22",
     "ahooks": "^3.7.2",
     "antd": "5.24.2",
     "antd-style": "3.7.1",
@@ -49,5 +49,5 @@
     "react-router-dom": "^6.30.1",
     "zxing-wasm": "^3.1.3"
   },
-  "gitHead": "b3ab91d3475d2763c922e0cad9486bf7cb20ac70"
+  "gitHead": "cee3e817effc899e8273b4e4c0bbc0fc6daa0870"
 }

package/src/flow/models/actions/JSItemActionModel.tsx

@@ -37,14 +37,30 @@ export class JSItemActionModel extends ActionModel {
   static scene = ActionSceneEnum.all;
 
   render() {
-    return <div ref={this.context.ref} style={{ display: 'inline-flex', minHeight: 22, alignItems: 'center' }} />;
+    return (
+      <div
+        ref={this.context.ref}
+        style={{
+          display: 'inline-flex',
+          minHeight: 22,
+          minWidth: this.context.flowSettingsEnabled ? this.context.themeToken?.controlHeightLG ?? 40 : undefined,
+          alignItems: 'center',
+        }}
+      />
+    );
   }
 
   renderHiddenInConfig(): React.ReactNode | undefined {
     return (
       <div
         ref={this.context.ref}
-        style={{ display: 'inline-flex', minHeight: 22, alignItems: 'center', opacity: 0.3 }}
+        style={{
+          display: 'inline-flex',
+          minHeight: 22,
+          minWidth: this.context.themeToken?.controlHeightLG ?? 40,
+          alignItems: 'center',
+          opacity: 0.3,
+        }}
       />
     );
   }
@@ -62,7 +78,7 @@ export class JSItemActionModel extends ActionModel {
     }
 
     if (this._mountedOnce && this.context.ref?.current) {
-      void this.applyFlow('jsSettings');
+      this.applyFlow('jsSettings');
     }
     this._mountedOnce = true;
   }

package/src/flow/models/actions/__tests__/JSItemActionModel.test.tsx

@@ -8,13 +8,59 @@
  */
 
 import React from 'react';
-import { render, screen, waitFor } from '@nocobase/test/client';
+import { act, render, screen, waitFor } from '@nocobase/test/client';
 import { App, ConfigProvider } from 'antd';
 import { describe, expect, it } from 'vitest';
 import { FlowEngine, FlowEngineProvider, FlowModelRenderer } from '@nocobase/flow-engine';
 import { JSItemActionModel } from '../JSItemActionModel';
 
 describe('JSItemActionModel', () => {
+  it('keeps empty items reachable in configuration mode without replacing rendered content', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ JSItemActionModel });
+    const model = engine.createModel<JSItemActionModel>({ use: 'JSItemActionModel' });
+    await engine.flowSettings.disable();
+
+    render(model.render());
+    const host = model.context.ref.current;
+    expect(host).toBeInstanceOf(HTMLDivElement);
+    expect(host.style.minWidth).toBe('');
+    expect(host.textContent).toBe('');
+
+    await act(async () => {
+      await engine.flowSettings.enable();
+    });
+    await waitFor(() => expect(host.style.minWidth).toBe('40px'));
+
+    const content = document.createElement('button');
+    content.textContent = 'Custom action';
+    host.appendChild(content);
+
+    await act(async () => {
+      await engine.flowSettings.disable();
+    });
+    await waitFor(() => expect(host.style.minWidth).toBe(''));
+    expect(model.context.ref.current).toBe(host);
+    expect(host.firstElementChild).toBe(content);
+  });
+
+  it('keeps hidden empty items configurable and removes them outside configuration mode', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ JSItemActionModel });
+    const model = engine.createModel<JSItemActionModel>({ use: 'JSItemActionModel' });
+    model.setHidden(true);
+    await engine.flowSettings.enable();
+
+    const { container } = render(model.render());
+    expect(model.context.ref.current.style.minWidth).toBe('40px');
+    expect(model.context.ref.current.style.opacity).toBe('0.3');
+
+    await act(async () => {
+      await engine.flowSettings.disable();
+    });
+    await waitFor(() => expect(container).toBeEmptyDOMElement());
+  });
+
   it('renders collection-level custom content', async () => {
     const engine = new FlowEngine();
     engine.registerModels({ JSItemActionModel });