lu-lowcode-package-form 0.9.7 → 0.9.8

package/dist/style.css

@@ -1 +1 @@
-*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.fabsolute{position:absolute}.frelative{position:relative}.fleft-0{left:0}.ftop-0{top:0}.fz-10{z-index:10}.fmb-5{margin-bottom:1.25rem}.fmt-2{margin-top:.5rem}.fflex{display:flex}.fhidden{display:none}.fh-11{height:2.75rem}.fh-24{height:6rem}.fh-8{height:2rem}.fh-full{height:100%}.fmax-h-full{max-height:100%}.fmin-h-5{min-height:1.25rem}.fw-24{width:6rem}.fw-\[960px\]{width:960px}.fw-full{width:100%}.fmin-w-36{min-width:9rem}.fmax-w-full{max-width:100%}.fcursor-pointer{cursor:pointer}.fflex-col{flex-direction:column}.fflex-wrap{flex-wrap:wrap}.fitems-center{align-items:center}.fitems-stretch{align-items:stretch}.fjustify-center{justify-content:center}.fjustify-between{justify-content:space-between}.fgap-1{gap:.25rem}.fgap-2{gap:.5rem}.fgap-3{gap:.75rem}.foverflow-hidden{overflow:hidden}.frounded{border-radius:.25rem}.fborder{border-width:1px}.fborder-l-4{border-left-width:4px}.fborder-dashed{border-style:dashed}.fborder-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.fborder-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.fborder-slate-300{--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity))}.fbg-gray-900{--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity))}.fbg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity))}.fbg-slate-100{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.fbg-transparent{background-color:transparent}.fbg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.fbg-opacity-50{--tw-bg-opacity: .5}.fobject-contain{object-fit:contain}.fp-4{padding:1rem}.fp-6{padding:1.5rem}.fpb-10{padding-bottom:2.5rem}.fpl-2{padding-left:.5rem}.ftext-lg{font-size:1.125rem;line-height:1.75rem}.ftext-sm{font-size:.875rem;line-height:1.25rem}.ftext-xs{font-size:.75rem;line-height:1rem}.ffont-medium{font-weight:500}.ftext-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ftext-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.hover\:fborder-\[\#3e92f8\]:hover{--tw-border-opacity: 1;border-color:rgb(62 146 248 / var(--tw-border-opacity))}.hover\:ftext-\[\#3e92f8\]:hover{--tw-text-opacity: 1;color:rgb(62 146 248 / var(--tw-text-opacity))}.hover\:ftext-gray-200:hover{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}.fgroup:hover .group-hover\:fflex{display:flex}.fgroup:hover .group-hover\:fbg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))}
+*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.fabsolute{position:absolute}.frelative{position:relative}.fleft-0{left:0}.ftop-0{top:0}.fz-10{z-index:10}.fmb-5{margin-bottom:1.25rem}.fmt-2{margin-top:.5rem}.fflex{display:flex}.fhidden{display:none}.fh-11{height:2.75rem}.fh-12{height:3rem}.fh-24{height:6rem}.fh-8{height:2rem}.fh-full{height:100%}.fmax-h-full{max-height:100%}.fmin-h-20{min-height:5rem}.fmin-h-5{min-height:1.25rem}.fw-24{width:6rem}.fw-\[960px\]{width:960px}.fw-full{width:100%}.fmin-w-36{min-width:9rem}.fmax-w-full{max-width:100%}.fcursor-pointer{cursor:pointer}.fflex-col{flex-direction:column}.fflex-wrap{flex-wrap:wrap}.fflex-nowrap{flex-wrap:nowrap}.fitems-center{align-items:center}.fitems-stretch{align-items:stretch}.fjustify-center{justify-content:center}.fjustify-between{justify-content:space-between}.fgap-1{gap:.25rem}.fgap-2{gap:.5rem}.fgap-3{gap:.75rem}.foverflow-auto{overflow:auto}.foverflow-hidden{overflow:hidden}.frounded{border-radius:.25rem}.frounded-t-md{border-top-left-radius:.375rem;border-top-right-radius:.375rem}.fborder{border-width:1px}.fborder-b{border-bottom-width:1px}.fborder-l-4{border-left-width:4px}.fborder-dashed{border-style:dashed}.fborder-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.fborder-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.fborder-slate-300{--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity))}.fbg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.fbg-gray-900{--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity))}.fbg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity))}.fbg-slate-50{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.fbg-transparent{background-color:transparent}.fbg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.fbg-opacity-50{--tw-bg-opacity: .5}.fobject-contain{object-fit:contain}.fp-2{padding:.5rem}.fp-4{padding:1rem}.fp-6{padding:1.5rem}.fpx-2{padding-left:.5rem;padding-right:.5rem}.fpb-10{padding-bottom:2.5rem}.fpl-2{padding-left:.5rem}.ftext-lg{font-size:1.125rem;line-height:1.75rem}.ftext-sm{font-size:.875rem;line-height:1.25rem}.ftext-xs{font-size:.75rem;line-height:1rem}.ffont-medium{font-weight:500}.ffont-semibold{font-weight:600}.ftext-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ftext-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.hover\:fborder-\[\#3e92f8\]:hover{--tw-border-opacity: 1;border-color:rgb(62 146 248 / var(--tw-border-opacity))}.hover\:ftext-\[\#3e92f8\]:hover{--tw-text-opacity: 1;color:rgb(62 146 248 / var(--tw-text-opacity))}.hover\:ftext-gray-200:hover{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}.fgroup:hover .group-hover\:fflex{display:flex}.fgroup:hover .group-hover\:fbg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lu-lowcode-package-form",
-  "version": "0.9.7",
+  "version": "0.9.8",
   "dependencies": {
     "@ant-design/icons": "^4.8.1",
     "@testing-library/jest-dom": "^5.17.0",

package/src/App.jsx

@@ -30,12 +30,12 @@ function App() {
   }
   const setFormFields = () => {
     formRef?.current?.formRef?.setFieldsValue({
-      CheckboxGroup:"[\"1\",\"2\"]",
-      UploadFile:"[{\"uid\":\"rc-upload-1718779211228-3\",\"url\":\"/files/20240619/ZmUznJfquBeSmOUC_pdf/17204092_43b027e81a384b0590f0f453288544dd-040624-1533-978.pdf\",\"name\":\"17204092_43b027e81a384b0590f0f453288544dd-040624-1533-978.pdf\",\"status\":\"done\"}]",
-      UploadImage:"[{\"uid\":\"rc-upload-1718779211228-5\",\"url\":\"https://imgs.699pic.com/images/501/361/351.jpg!list1x.v2\",\"name\":\"nouser.png\",\"status\":\"done\"},{\"uid\":\"rc-upload-1718779211228-7\",\"url\":\"https://avatars.githubusercontent.com/u/4323180?s=80&u=f6ec6f10c061cf179610c5afd8b120ca2c29ea7f&v=4\",\"name\":\"1717032062027(1).jpg\",\"status\":\"done\"},{\"uid\":\"rc-upload-1718779211228-9\",\"url\":\"/files/20240619/TlomGohpkBxXyRqN_png/logo-adg.png\",\"name\":\"logo-adg.png\",\"status\":\"done\"}]",
-      select1:"1",
-      select2:"[\"1\",\"2\"]",
-      switch:"1",
+      CheckboxGroup: "[\"1\",\"2\"]",
+      UploadFile: "[{\"uid\":\"rc-upload-1718779211228-3\",\"url\":\"/files/20240619/ZmUznJfquBeSmOUC_pdf/17204092_43b027e81a384b0590f0f453288544dd-040624-1533-978.pdf\",\"name\":\"17204092_43b027e81a384b0590f0f453288544dd-040624-1533-978.pdf\",\"status\":\"done\"}]",
+      UploadImage: "[{\"uid\":\"rc-upload-1718779211228-5\",\"url\":\"https://imgs.699pic.com/images/501/361/351.jpg!list1x.v2\",\"name\":\"nouser.png\",\"status\":\"done\"},{\"uid\":\"rc-upload-1718779211228-7\",\"url\":\"https://avatars.githubusercontent.com/u/4323180?s=80&u=f6ec6f10c061cf179610c5afd8b120ca2c29ea7f&v=4\",\"name\":\"1717032062027(1).jpg\",\"status\":\"done\"},{\"uid\":\"rc-upload-1718779211228-9\",\"url\":\"/files/20240619/TlomGohpkBxXyRqN_png/logo-adg.png\",\"name\":\"logo-adg.png\",\"status\":\"done\"}]",
+      select1: "1",
+      select2: "[\"1\",\"2\"]",
+      switch: "1",
       datetime: "2021-12-12",
       datetime2: "2021-12-12",
       datetime3: "2021-12-12",
@@ -50,12 +50,17 @@ function App() {
   return (
 
     <div className="App fflex fflex-col fitems-center">
-      
+
       <div className='fw-full fp-4'>
-          <Setter.OptionSetter />
-        </div>
-      <div className='fw-[960px] frounded  fbg-slate-100 fflex fflex-col fitems-center fpb-10'>
+        <Setter.OptionSetter />
+      </div>
+      <div className='fw-[960px] frounded  fbg-slate-50 fflex fflex-col fitems-center fpb-10'>
         <FormContainerWrapper cols={cols} className="" ref={formRef} >
+          <Layout.Table _componentName="Layout.Table" label="子表格" __id="table" >
+            <Field.CodeMachine label="角色编号" prompt="" __id="code" />
+            <Field.Input label="分组名" __id="title" />
+            <Field.MultipleSelect mode="multiple" label="测多选" __id="select2" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.MultipleSelect>
+          </Layout.Table>
           <Field.Input label="分组名" __id="title" />
           <Field.SingleSelect mode="single" label="测试单选" __id="select1" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.SingleSelect>
           <Field.MultipleSelect mode="multiple" label="测多选" __id="select2" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.MultipleSelect>
@@ -89,10 +94,10 @@ function App() {
 
         </FormContainerWrapper>
         <div class="fgroup">11111
-  <div class="fbg-red-500 group-hover:fbg-blue-500">
-    Hover over me or my parent!
-  </div>
-</div>
+          <div class="fbg-red-500 group-hover:fbg-blue-500">
+            Hover over me or my parent!
+          </div>
+        </div>
         <Button type="primary" onClick={getFormFields}>GetValues</Button>
         <Button type="primary" onClick={setFormFields}>SetValues</Button>
         <Button type="primary" onClick={handleCols}>UpdateCol</Button>

package/src/components/field/base.jsx

@@ -2,15 +2,28 @@ export const BaseWrapper = function BaseWrapper({
     label,
     children,
     prompt,
+    subTable,
+    subTableIndex,
     ...otherProps
 }) {
-    return (
+    const formWarpper =  (
         <div className="frelative">
             {label && <div className='fh-8 ftext-sm fflex fjustify-between fitems-center'>{label}</div>}
             <div className="fw-full fflex fitems-stretch">
                 {children}
             </div>
-            <div className="ftext-xs ftext-gray-500 fmin-h-5 fflex fitems-center">{prompt}</div>
+            {!subTable && <div className="ftext-xs ftext-gray-500 fmin-h-5 fflex fitems-center">{prompt}</div>}
         </div>
-    );
+    )
+
+    const tableWarpper = (
+        <div className="frelative fw-full">
+            {label && subTableIndex === 0 && <div className='fh-12 ffont-semibold fbg-gray-100 ftext-sm fflex fjustify-between fitems-center fpx-2 fborder-b frounded-t-md'>{label}</div>}
+            <div className="fw-full fflex fitems-stretch fp-2 fborder-b">
+                {children}
+            </div>
+        </div>
+    )
+        
+    return subTable ? tableWarpper : formWarpper;
 };

package/src/components/field/table/index.jsx

@@ -0,0 +1,36 @@
+import React, { useState } from "react"
+import { Button, Row } from "antd"
+
+const TableCol = ({ children, width, ...props }) => {
+    return <div className=" fw-full fmin-h-20 fflex fflex-nowrap foverflow-auto  " style={{ width: `${width}px` }} {...props}>
+        {children}
+    </div>
+}
+
+const Table = ({ children, ...props }) => {
+    const [rows, setRows] = useState([{}]); // 初始有一个空行
+
+    const addRow = () => {
+        setRows([...rows, {}]); // 添加新行
+    };
+
+    return (
+        <div className=" fw-full fmin-h-20 ">
+            <Button onClick={addRow}>添加行</Button>
+            {rows.map((row, rowIndex) => (
+                <div className=" fflex fflex-nowrap foverflow-auto " key={rowIndex}>
+                    {React.Children.map(children, (child, index) =>
+                        <TableCol width={200}>
+                            {React.cloneElement(child, { key: `row_${rowIndex}_child_${index}`, subTable: true, subTableIndex: rowIndex })}
+                        </TableCol>
+                    )}
+                </div>
+            ))}
+        </div>
+    );
+}
+
+export default Table
+
+export { TableCol };
+

package/src/components/field/upload/upload-image.jsx

@@ -22,8 +22,6 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
                 for (let i = 0; i < value.length; i++) {
                     let file = value[i]
                     var oldfile = fileMap.current.find((item) => item.uid === file.uid)
-                    console.log("set file", file)
-                    console.log("set oldfile", oldfile)
                     if (!oldfile ||( (oldfile.version||0) < (file.version||0 )))
                         _fileList.push(file)
                     else _fileList.push(oldfile)

package/src/components/form-container/index.jsx

@@ -16,7 +16,7 @@ function batchElements(elements, groupSize) {
     for (const element of elements) {
         const { _componentName } = element?.props || {};
 
-        if (_componentName && _componentName.startsWith('Layout')) {
+        if (_componentName && _componentName.startsWith('Layout.')) {
             if (tempArray.length > 0) {
                 fillWithReactElement(groupSize, tempArray);
                 groupedElements.push(tempArray);
@@ -134,7 +134,7 @@ const FormContainer = forwardRef(({ cols = 1, children }, ref) => {
                 {group.map((child, index) => {
                     const { componentId, __id, _componentName, ...props } = child.props;
                     const identifier = componentId || __id;
-                    const isLayoutComponent = _componentName && _componentName.startsWith('Layout');
+                    const isLayoutComponent = _componentName && _componentName.startsWith('Layout.');
 
                     return (
                         <Col key={identifier || `col-${index}`} span={isLayoutComponent ? 24 : 24 / group.length} style={{ marginBottom: 0 }}>

package/src/components/index.jsx

@@ -8,6 +8,7 @@ import { default as RadioGroup } from './field/radio/index.jsx'
 import { UploadFile,UploadImage } from './field/upload'
 import  {default as Switch} from './field/switch'
 import {default as DatePicker } from './field/date-picker'
+import { default as Table , TableCol } from './field/table'
 const Field = {
     Input,
     TextArea,
@@ -32,7 +33,9 @@ const Field = {
 }
 const Layout = {
     FormRow: LayoutFormRow,
-    FormGroupTitle: LayoutFormGroupTitle
+    FormGroupTitle: LayoutFormGroupTitle,
+    Table,
+    TableCol
 }
 export { FormContainer, Field ,FormContainerWrapper,Layout }
 import { default as OptionSetter} from './setter/optionsetter'