jrs-react 1.2.30 → 1.2.32

package/build/index.es.js

@@ -3957,6 +3957,9 @@ const FreeType = ({
   }
 };
 const StyledJRFrame = styled.div`
+    color:#525252;
+    background:white;
+
     position:relative;
     display:flex;
     flex:1;
@@ -4008,7 +4011,7 @@ class JRFrame extends JRSubmit {
     return /*#__PURE__*/React__default.createElement(StyledJRFrame, {
       id: this.props.id,
       style: this.props.style,
-      className: `jr-frame`
+      className: `jr-frame ${this.props.popup !== true ? this.props.className : ''}`
     }, /*#__PURE__*/React__default.createElement(FreeType, {
       tag: "div",
       config: this.props.start,
@@ -4737,7 +4740,6 @@ function styleInject(css, ref) {
 }
 
 var css_248z = ".Style-module_test__LrdEc{border:1px solid red;color:red}.Style-module_withMask__LPcai{overflow:hidden!important;position:relative;user-select:none;&:after{a:#868686cc;background:#868686cc;border-radius:inherit;bottom:0;content:\"\";height:10000px;left:0;position:absolute;right:0;top:0;width:10000px}}mask{background:#868686cc;border-radius:inherit;bottom:0;height:10000px;left:0;position:absolute;right:0;top:0;width:10000px}";
-var style = {"test":"Style-module_test__LrdEc","withMask":"Style-module_withMask__LPcai"};
 styleInject(css_248z);
 
 const StyledJRWindow = styled.div`
@@ -4813,11 +4815,8 @@ class JRWindow extends JRFrame {
     this.mask.style.height = '10000px';
     this.mask.style.width = '10000px';
     target.appendChild(this.mask);
-    po('style.mask', style.mask);
-    po('addMask+++++++++++++++++++++++++++');
   };
   removeMaskFromTarget = () => {
-    po('removeMask-----------------------');
     this.mask.remove();
   };
   backdropOn(on) {
@@ -5351,8 +5350,6 @@ const StyledJRTable = styled.div`
     --column-b-hover-color:#eeeeee;
 
     position: relative;
-    background: var(--column-b-color);
-    border:1px solid var(--column-bd-color);
 
     display:flex;
     flex-direction: column;
@@ -5392,7 +5389,6 @@ const StyledJRTable = styled.div`
                 padding: 2px 6px;
                 background: linear-gradient(180deg, rgba(227, 227, 226, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(210, 210, 210, 1) 100%);
                 box-shadow: 2px 2px 2px 0 #ffffffd6 inset, -1px -1px 2px 0px #8a847dbf inset;
-                color: #525252;
                 white-space: nowrap;
             }
         }
@@ -5401,21 +5397,10 @@ const StyledJRTable = styled.div`
             position: sticky;
             bottom: -1px;
 
-            Xtr:nth-child(1){
-                th{
-                    Xborder-top:1px solid var(--column-bd-color);
-                }
-            }
-            Xth:nth-child(1){
-                Xborder-left:1px solid var(--column-bd-color);
-            }
-                
             th{
                 height:32px;
                 padding: 4px;
                 background: #e4e4e4;
-                xbackground: linear-gradient(180deg, rgba(227, 227, 226, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(210, 210, 210, 1) 100%);
-                xbox-shadow: 2px 2px 2px 0 #ffffffd6 inset, -1px -1px 2px 0px #8a847dbf inset;
                 color: #525252;
                 white-space: nowrap;
 
@@ -5429,7 +5414,6 @@ const StyledJRTable = styled.div`
         tbody{
             tr{
                 transition: background .3s linear;
-                background:var(--column-b-color);
                 a:#ededed;
                 th{
                     color:#444444;
@@ -5442,7 +5426,6 @@ const StyledJRTable = styled.div`
             }
             tr:hover{
                 background:var(--column-b-hover-color);
-                
             }
             
             tr.jr-group-header
@@ -5854,7 +5837,9 @@ class JRFields extends JRWindow {
     const value = name ? parentValue?.[name] : parentValue;
     const gap = column.gap ?? this.props.gap;
     const label = column.label;
-    const _style = flexType(style, this, {}, {});
+    const _style = flexType({
+      ...style
+    }, this, {}, {});
     const _columnStyle = flexType(columnStyle, this, {}, {});
     if (colSpan) _style.gridColumn = `span ${colSpan}`;
     if (rowSpan) _style.gridRow = `span ${rowSpan}`;

package/build/index.js

@@ -3984,6 +3984,9 @@ const FreeType = ({
   }
 };
 const StyledJRFrame = styled__default["default"].div`
+    color:#525252;
+    background:white;
+
     position:relative;
     display:flex;
     flex:1;
@@ -4035,7 +4038,7 @@ class JRFrame extends JRSubmit {
     return /*#__PURE__*/React__default["default"].createElement(StyledJRFrame, {
       id: this.props.id,
       style: this.props.style,
-      className: `jr-frame`
+      className: `jr-frame ${this.props.popup !== true ? this.props.className : ''}`
     }, /*#__PURE__*/React__default["default"].createElement(FreeType, {
       tag: "div",
       config: this.props.start,
@@ -4764,7 +4767,6 @@ function styleInject(css, ref) {
 }
 
 var css_248z = ".Style-module_test__LrdEc{border:1px solid red;color:red}.Style-module_withMask__LPcai{overflow:hidden!important;position:relative;user-select:none;&:after{a:#868686cc;background:#868686cc;border-radius:inherit;bottom:0;content:\"\";height:10000px;left:0;position:absolute;right:0;top:0;width:10000px}}mask{background:#868686cc;border-radius:inherit;bottom:0;height:10000px;left:0;position:absolute;right:0;top:0;width:10000px}";
-var style = {"test":"Style-module_test__LrdEc","withMask":"Style-module_withMask__LPcai"};
 styleInject(css_248z);
 
 const StyledJRWindow = styled__default["default"].div`
@@ -4840,11 +4842,8 @@ class JRWindow extends JRFrame {
     this.mask.style.height = '10000px';
     this.mask.style.width = '10000px';
     target.appendChild(this.mask);
-    po('style.mask', style.mask);
-    po('addMask+++++++++++++++++++++++++++');
   };
   removeMaskFromTarget = () => {
-    po('removeMask-----------------------');
     this.mask.remove();
   };
   backdropOn(on) {
@@ -5378,8 +5377,6 @@ const StyledJRTable = styled__default["default"].div`
     --column-b-hover-color:#eeeeee;
 
     position: relative;
-    background: var(--column-b-color);
-    border:1px solid var(--column-bd-color);
 
     display:flex;
     flex-direction: column;
@@ -5419,7 +5416,6 @@ const StyledJRTable = styled__default["default"].div`
                 padding: 2px 6px;
                 background: linear-gradient(180deg, rgba(227, 227, 226, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(210, 210, 210, 1) 100%);
                 box-shadow: 2px 2px 2px 0 #ffffffd6 inset, -1px -1px 2px 0px #8a847dbf inset;
-                color: #525252;
                 white-space: nowrap;
             }
         }
@@ -5428,21 +5424,10 @@ const StyledJRTable = styled__default["default"].div`
             position: sticky;
             bottom: -1px;
 
-            Xtr:nth-child(1){
-                th{
-                    Xborder-top:1px solid var(--column-bd-color);
-                }
-            }
-            Xth:nth-child(1){
-                Xborder-left:1px solid var(--column-bd-color);
-            }
-                
             th{
                 height:32px;
                 padding: 4px;
                 background: #e4e4e4;
-                xbackground: linear-gradient(180deg, rgba(227, 227, 226, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(210, 210, 210, 1) 100%);
-                xbox-shadow: 2px 2px 2px 0 #ffffffd6 inset, -1px -1px 2px 0px #8a847dbf inset;
                 color: #525252;
                 white-space: nowrap;
 
@@ -5456,7 +5441,6 @@ const StyledJRTable = styled__default["default"].div`
         tbody{
             tr{
                 transition: background .3s linear;
-                background:var(--column-b-color);
                 a:#ededed;
                 th{
                     color:#444444;
@@ -5469,7 +5453,6 @@ const StyledJRTable = styled__default["default"].div`
             }
             tr:hover{
                 background:var(--column-b-hover-color);
-                
             }
             
             tr.jr-group-header
@@ -5881,7 +5864,9 @@ class JRFields extends JRWindow {
     const value = name ? parentValue?.[name] : parentValue;
     const gap = column.gap ?? this.props.gap;
     const label = column.label;
-    const _style = flexType(style, this, {}, {});
+    const _style = flexType({
+      ...style
+    }, this, {}, {});
     const _columnStyle = flexType(columnStyle, this, {}, {});
     if (colSpan) _style.gridColumn = `span ${colSpan}`;
     if (rowSpan) _style.gridRow = `span ${rowSpan}`;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "jrs-react",
-	"version": "1.2.30",
+	"version": "1.2.32",
 	"description": "",
 	"main": "build/index.js",
 	"module": "build/index.es.js",

package/src/components/JRFields/JRFields.jsx

@@ -317,7 +317,8 @@ export default class JRFields extends JRWindow {
         const value=name?parentValue?.[name]:parentValue
         const gap=column.gap??this.props.gap
         const label=column.label
-        const _style=flexType(style,this,{},{})
+
+        const _style=flexType({...style},this,{},{})
         const _columnStyle=flexType(columnStyle,this,{},{})
         if (colSpan) _style.gridColumn = `span ${colSpan}`
         if (rowSpan) _style.gridRow = `span ${rowSpan}`

package/src/components/JRFrame/JRFrame.jsx

@@ -18,6 +18,9 @@ export const FreeType=({tag:Tag,config,me,className})=>{
 }
 
 const StyledJRFrame=styled.div`
+    color:#525252;
+    background:white;
+
     position:relative;
     display:flex;
     flex:1;
@@ -68,7 +71,9 @@ export default class JRFrame extends JRSubmit {
         }
         :null
     renderer(){
-        return <StyledJRFrame  id={this.props.id} style={this.props.style} className={`jr-frame`} >
+        return <StyledJRFrame  id={this.props.id} style={this.props.style} 
+            className={`jr-frame ${(this.props.popup!==true  )? this.props.className:''}`} 
+        >
             <FreeType tag='div' config={this.props.start} me={this} className={'start'}/>
             <main>
                 <FreeType tag='header' config={this.props.top} me={this}/>

package/src/components/JRTable/StyledJRTable.jsx

@@ -6,8 +6,6 @@ export const StyledJRTable=styled.div`
     --column-b-hover-color:#eeeeee;
 
     position: relative;
-    background: var(--column-b-color);
-    border:1px solid var(--column-bd-color);
 
     display:flex;
     flex-direction: column;
@@ -47,7 +45,6 @@ export const StyledJRTable=styled.div`
                 padding: 2px 6px;
                 background: linear-gradient(180deg, rgba(227, 227, 226, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(210, 210, 210, 1) 100%);
                 box-shadow: 2px 2px 2px 0 #ffffffd6 inset, -1px -1px 2px 0px #8a847dbf inset;
-                color: #525252;
                 white-space: nowrap;
             }
         }
@@ -56,21 +53,10 @@ export const StyledJRTable=styled.div`
             position: sticky;
             bottom: -1px;
 
-            Xtr:nth-child(1){
-                th{
-                    Xborder-top:1px solid var(--column-bd-color);
-                }
-            }
-            Xth:nth-child(1){
-                Xborder-left:1px solid var(--column-bd-color);
-            }
-                
             th{
                 height:32px;
                 padding: 4px;
                 background: #e4e4e4;
-                xbackground: linear-gradient(180deg, rgba(227, 227, 226, 1) 0%, rgba(255, 255, 255, 1) 25%, rgba(210, 210, 210, 1) 100%);
-                xbox-shadow: 2px 2px 2px 0 #ffffffd6 inset, -1px -1px 2px 0px #8a847dbf inset;
                 color: #525252;
                 white-space: nowrap;
 
@@ -84,7 +70,6 @@ export const StyledJRTable=styled.div`
         tbody{
             tr{
                 transition: background .3s linear;
-                background:var(--column-b-color);
                 a:#ededed;
                 th{
                     color:#444444;
@@ -97,7 +82,6 @@ export const StyledJRTable=styled.div`
             }
             tr:hover{
                 background:var(--column-b-hover-color);
-                
             }
             
             tr.jr-group-header

package/src/components/JRWindow/JRWindow.jsx

@@ -73,11 +73,8 @@ export default class JRWindow extends JRFrame {
         this.mask.style.height='10000px'
         this.mask.style.width='10000px'
         target.appendChild(this.mask)
-        po('style.mask',style.mask)
-        po('addMask+++++++++++++++++++++++++++')
     }
     removeMaskFromTarget=()=>{
-        po('removeMask-----------------------')
         this.mask.remove()
     }
 

package/src/main.jsx

@@ -2,6 +2,9 @@ import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
 import './app/index.css'
 import App from './app/App.jsx'
+import JRFields from './components/JRFields/JRFields.jsx'
+import JRText from './components/JRInput/JRText.jsx'
 
 const root = createRoot(document.getElementById('root'))
 root.render(<App/>)
+