npm - jrs-react - Versions diffs - 1.2.12 → 1.2.14 - Mend

jrs-react 1.2.12 → 1.2.14

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.

Files changed (41) hide show

package/build/index.es.js +964 -3488
package/build/index.js +982 -3486
package/index.html +2 -2
package/package.json +6 -1
package/public/alert.json +4 -0
package/public/data.json +10 -0
package/public/data2.json +19 -0
package/public/list.json +99 -0
package/src/app/App.css +28 -5
package/src/app/App.jsx +22 -1
package/src/app/alert/AlertApp.jsx +92 -0
package/src/app/axios/AxiosApp.jsx +71 -0
package/src/app/fields/FieldsApp.jsx +22 -6
package/src/app/fields/fieldsConfig.jsx +227 -1
package/src/app/fields/tryHOC.jsx +21 -0
package/src/app/fields/validator.jsx +217 -0
package/src/app/index.css +1 -1
package/src/app/table/tableConfig.jsx +4 -1
package/src/app/test/index.jsx +8 -0
package/src/app/window/WindowApp.jsx +120 -73
package/src/assets/icon/index.jsx +0 -13
package/src/components/JRAlert/index.jsx +71 -0
package/src/components/JRFields/JRFields.jsx +178 -129
package/src/components/JRFields/StyleJRFields.jsx +2 -3
package/src/components/JRFields/Validators.jsx +33 -0
package/src/components/JRFrame/JRFrame.jsx +12 -7
package/src/components/JRFrame/JRFrameHOC.jsx +61 -0
package/src/components/JRInput/JRInput.jsx +3 -2
package/src/components/JRS.jsx +4 -0
package/src/components/JRSubmit.jsx +1 -3
package/src/components/JRTable/JRTable.jsx +10 -7
package/src/components/JRTable/StyledJRTable.jsx +8 -0
package/src/components/JRTable/THead.jsx +1 -1
package/src/components/JRWindow/JRWindow.jsx +74 -10
package/src/components/JRWindow/JRWindowHOC.jsx +114 -0
package/src/components/JRWindow/Slider.jsx +21 -15
package/src/components/JRWindow/Style.module.css +35 -0
package/src/components/JRWindow/TitleBar.jsx +137 -35
package/src/index.js +2 -1
package/src/main.jsx +2 -1
package/src/components/JRUtil.jsx +0 -1

package/index.html CHANGED Viewed

@@ -1,12 +1,12 @@
 <!doctype html>
-<html lang="en">
+<html lang="en" id="html">
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Vite + React</title>
   </head>
-  <body style="background: black;color:gray;">
+  <body id="body" style="background: black;color:white;">
     <div id="root"></div>
     <script type="module" src="/src/main.jsx"></script>
   </body>

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
 	"name": "jrs-react",
-	"version": "1.2.12",
+	"version": "1.2.14",
 	"description": "",
 	"main": "build/index.js",
 	"module": "build/index.es.js",
@@ -21,6 +21,7 @@
 		"@vitejs/plugin-react": "^4.3.4",
 		"antd": "^5.12.5",
 		"axios": "^1.6.2",
+		"create-react-class": "^15.7.0",
 		"globals": "^15.15.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
@@ -29,6 +30,10 @@
 		"vite": "^6.2.0",
 		"vite-plugin-svgr": "^4.3.0"
 	},
+	"peerDependencies": {
+		"react": "^18.2.0",
+		"react-dom": "^18.2.0"
+	},
 	"devDependencies": {
 		"@babel/core": "^7.26.10",
 		"@chromatic-com/storybook": "^3.2.6",

package/public/alert.json ADDED Viewed

@@ -0,0 +1,4 @@
+{
+    "title":"I am from server title"
+    ,"message":"I am from server message"
+}

package/public/data.json CHANGED Viewed

@@ -4,6 +4,16 @@
          {"phone":"0948272834","name":"中華電信"}
         ,{"phone":"0987304555","name":"遠傳"}
     ]
+    ,"dataUrl":"data.json"
     ,"account":"jorenlai"
     ,"email":"joren.lai@gmail.com"
+    ,"address":{
+        "no":"53-102"
+        ,"street":"Jalan Indah"
+        ,"postcode":"86000"
+        ,"state":"Johor"
+        ,"country":"Malaysia"
+    }
+    ,"father":"Lai"
+    ,"mother":"Wong"
 }

package/public/data2.json ADDED Viewed

@@ -0,0 +1,19 @@
+{
+    "name":"Joren 2"
+    ,"phone":[
+         {"phone":"0948272834","name":"中華電信"}
+        ,{"phone":"0987304555","name":"遠傳"}
+    ]
+    ,"dataUrl":"data.json"
+    ,"account":"jorenlai"
+    ,"email":"joren.lai@gmail.com"
+    ,"address":{
+        "no":"53-102"
+        ,"street":"Jalan Indah"
+        ,"postcode":"86000"
+        ,"state":"Johor"
+        ,"country":"Malaysia"
+    }
+    ,"father":"Lai"
+    ,"mother":"Wong"
+}

package/public/list.json CHANGED Viewed

@@ -17,4 +17,103 @@
             ,"country":"台灣"
         }
     }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
+    ,{
+        "name":"John"
+        ,"phone":"0124873737"
+        ,"address":{
+            "no":"36"
+            ,"street":"景興路"
+            ,"country":"台灣"
+        }
+    }
 ]

package/src/app/App.css CHANGED Viewed

@@ -1,8 +1,31 @@
-#root {
-}
 html,*,*:before,*:after {
     box-sizing: border-box;
-  }
+}
+.withMask{
+    position: relative;
+    overflow: hidden !important;
+    user-select: none;
+    &::after{
+        content:'' ;
+        background : #868686cc;
+        a:#868686cc;
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        border-radius: inherit;
+        height: 10000px;
+        width: 10000px;
+    }
+}
+#jr-alert-div{
+    >div:not(:last-child){
+        display: none;
+    }
+}

package/src/app/App.jsx CHANGED Viewed

@@ -1,16 +1,37 @@
-import { BrowserRouter, Route, Routes } from 'react-router-dom'
+import { BrowserRouter, Route, Routes ,Link} from 'react-router-dom'
 import './App.css'
 import TableApp from './table/TableApp'
 import FieldsApp from './fields/FieldsApp'
 import WindowApp from './window/WindowApp'
+import AxiosApp from './axios/AxiosApp'
+import AlertApp from './alert/AlertApp'
+import { po } from '../components/JRUtils'
+import TestApp from './test'
 function App() {
+	const apps={
+		TableApp,FieldsApp,WindowApp,AxiosApp,AlertApp,TestApp
+	}
 	return <BrowserRouter>
+		{
+			Object.entries(apps).map(([key,app],index)=>{
+				return <span key={key} style={{padding:'8px'}}><Link to={`/${key}`}>{key}</Link></span>
+			})
+		}
 		<Routes>
+			{
+				Object.entries(apps).map(([key,App],index)=>{
+					return <Route path={`/${key}`} element={<App/>} key={key}/>
+				})
+			}
 			<Route path="/table" element={<TableApp/>}/>
 			<Route path="/fields" element={<FieldsApp/>}/>
 			<Route path="/window" element={<WindowApp/>}/>
+			<Route path="/axios" element={<AxiosApp/>}/>
+			<Route path="/alert" element={<AlertApp/>}/>
 		</Routes>
+		<div id='play' style={{width:'500px',height:'500px',border:'1px solid gray'}}> </div>
 	</BrowserRouter>
 }

package/src/app/alert/AlertApp.jsx ADDED Viewed

@@ -0,0 +1,92 @@
+import React, { useEffect } from "react"
+import { createPortal } from 'react-dom'
+import JRAlert from "../../components/JRAlert"
+import JRS from "../../components/JRS"
+import { po } from "../../components/JRUtils"
+import createClass from 'create-react-class';
+const Show = createClass({
+    render: () => <h1>This is coming from createClass() function</h1>,
+  });
+function AlertApp1() {
+    useEffect(()=>{
+        // root.render(<div>VVVVVVVVV</div>)
+    })
+    return <div>Alert <Show/></div>
+}
+function AlertApp() {
+    useEffect(()=>{
+        JRAlert({
+            title:'Static Title'
+            ,message:'Default message'
+            ,x:100
+            ,y:100
+        })
+        JRAlert({
+            title:'Static Title'
+            ,message:'Default message'
+            ,x:200
+            ,y:200
+        })
+        JRAlert({
+            title:'Static Title'
+            ,message:'Default message'
+            ,x:300
+            ,y:300
+        })
+        JRAlert({
+            title:'Static Title'
+            ,message:'Default message'
+            ,x:400
+            ,y:400
+        })
+    })
+    return <div>
+        <button
+            onClick={()=>{
+                JRAlert({
+                    title:'My alert'
+                    ,message:'Here you go'
+                    ,width:300
+                    ,height:160
+                    ,get:{
+                        url:'data.json'
+                        ,autoRun:true
+                    }
+                })
+            }}
+        >Alert</button>
+        <button
+            onClick={()=>{
+                JRAlert({
+                    title:'Another alert'
+                    ,message:'Here you go'
+                })
+            }}
+        >Alert 2</button>
+        <button
+            onClick={()=>{
+                JRAlert({
+                    title(){
+                        return this.getValue().title
+                    }
+                    ,get:{
+                        url:'alert.json'
+                        ,autoRun:true
+                    }
+                })
+            }}
+        >Server</button>
+    </div>
+}
+export default AlertApp

package/src/app/axios/AxiosApp.jsx ADDED Viewed

@@ -0,0 +1,71 @@
+import axios from "axios";
+import { useEffect } from "react";
+import styled from "styled-components";
+import { po } from "../../components/JRUtils";
+const StyledDiv=styled.div`
+    input {
+        background: #202020;
+        color:gray;
+    }
+`
+// const submit = axios.create({
+//     timeout: 120000,
+//     maxBodyLength: 104857600, //100mb 104857600
+//     maxContentLength: 104857600, //100mb
+// });
+// axios.interceptors.response.use(
+//     (Response) => {
+//         po('++++++++++++++++++++++++++',Response,Response)
+//         if(Response?.status!=200){
+//             po('fffffffffffffffff')
+//             return Promise.reject(Error);
+//         }
+//         return Promise.resolve(Response);
+//     },
+//     (Error) => {
+//         po('---------------------------',Error)
+//         return Promise.reject(Error);
+//     }
+// );
+export default function AxiosApp() {
+    const config = {
+        headers:{
+            Authorization: `Bearer AAAAA.bbbbbbbbbbbbbbbbbbbbb.ccccccccccccccc`
+            ,'Content-Type' : 'application/json'
+        }
+        ,emulateJSON: true
+        ,params: {
+            orderNo:'M20240720001'
+        }
+        ,responseType: "application/json"
+    };
+    useEffect(()=>{
+        axios.get('data.json'
+            , {
+                params:{
+                    name: "2",
+                    parts: "4"
+                }
+                ,...config
+            }
+            ,{
+                ...config
+            }
+        )
+        .then(response => {
+            po('then')
+            console.log(response)
+        })
+        .catch(error => {
+            po('catch')
+            console.log(error.response)
+        });
+    },[])
+	return <StyledDiv>StyledDiv 3</StyledDiv>
+}

package/src/app/fields/FieldsApp.jsx CHANGED Viewed

@@ -1,12 +1,28 @@
+import styled from "styled-components";
 import JRFields from "../../components/JRFields/JRFields";
-import JRText from "../../components/JRInput/JRText";
-import JRTable from "../../components/JRTable/JRTable";
-import { fieldsConfig } from "./fieldsConfig";
+import { fieldsValidator ,fields} from "./validator";
+import { devFields, normalFields, withSomeButton } from "./fieldsConfig";
+// import { tryHOC } from "./tryHOC";
+const StyledJRFields=styled(JRFields)`
+    input {
+        background: #202020;
+        color:gray;
+    }
+`
 export default function FieldsApp() {
-	return <JRFields
-        {...fieldsConfig}
-    />
+	return <>
+        <JRFields
+            {...devFields}
+            {...withSomeButton}
+            open={true}
+            popup={true}
+            width={900}
+            height={800}
+            title={'Fields'}
+        />
+    </>
 }