jrs-react 1.2.22 → 1.2.23

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 (27) hide show
  1. package/build/index.es.js +58 -5906
  2. package/build/index.js +58 -5947
  3. package/package.json +1 -1
  4. package/src/components/JRMask/JRMask.jsx +0 -3
  5. package/index.html +0 -13
  6. package/public/alert.json +0 -4
  7. package/public/data.json +0 -29
  8. package/public/data2.json +0 -19
  9. package/public/list.json +0 -132
  10. package/public/vite.svg +0 -1
  11. package/src/app/App.css +0 -42
  12. package/src/app/App.jsx +0 -35
  13. package/src/app/alert/AlertApp.jsx +0 -92
  14. package/src/app/axios/AxiosApp.jsx +0 -71
  15. package/src/app/dev/devApp.jsx +0 -146
  16. package/src/app/dev/tobeimport.js +0 -7
  17. package/src/app/fields/FieldsApp.jsx +0 -46
  18. package/src/app/fields/fieldsConfig.jsx +0 -472
  19. package/src/app/fields/tryHOC.jsx +0 -21
  20. package/src/app/fields/validator.jsx +0 -217
  21. package/src/app/index.css +0 -42
  22. package/src/app/input/InputApp.jsx +0 -43
  23. package/src/app/table/TableApp.jsx +0 -10
  24. package/src/app/table/tableConfig.jsx +0 -89
  25. package/src/app/test/index.jsx +0 -48
  26. package/src/app/window/WindowApp.jsx +0 -165
  27. package/vite.config.js +0 -15
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "jrs-react",
3
- "version": "1.2.22",
3
+ "version": "1.2.23",
4
4
  "description": "",
5
5
  "main": "build/index.js",
6
6
  "module": "build/index.es.js",
package/src/components/JRMask/JRMask.jsx CHANGED
@@ -176,9 +176,6 @@ class Mask extends JRHTML{
176
176
  this.yo.close()
177
177
  }
178
178
  }
179
- get msg(){
180
- return 'msg'
181
- }
182
179
  }
183
180
 
184
181
  export function showMask(msg,maskTarget,whichMask){
package/index.html DELETED
@@ -1,13 +0,0 @@
1
- <!doctype html>
2
- <html lang="en" id="html">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <link rel="icon" type="image/svg+xml" href="/vite.svg" />
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
- <title>Vite + React</title>
8
- </head>
9
- <body id="body" style="background: black;color:white;">
10
- <div id="root"></div>
11
- <script type="module" src="/src/main.jsx"></script>
12
- </body>
13
- </html>
package/public/alert.json DELETED
@@ -1,4 +0,0 @@
1
- {
2
- "title":"I am from server title"
3
- ,"message":"I am from server message"
4
- }
package/public/data.json DELETED
@@ -1,29 +0,0 @@
1
- {
2
- "name":"Joren"
3
- ,"phone":[
4
- {"phone":"0948272834","name":"中華電信"}
5
- ,{"phone":"0987304555","name":"遠傳"}
6
- ]
7
- ,"dataUrl":"data.json"
8
- ,"account":"jorenlai"
9
- ,"email":"joren.lai@gmail.com"
10
- ,"address":{
11
- "no":"53-102"
12
- ,"street":"Jalan Indah"
13
- ,"postcode":"86000"
14
- ,"state":"Johor"
15
- ,"country":"Malaysia"
16
- }
17
- ,"father":"Lai"
18
- ,"mother":"Wong"
19
-
20
- ,"checkbox": [
21
- 1,
22
- 3,
23
- 5
24
- ],
25
- "select": [
26
- 2
27
- ]
28
- ,"radio":1
29
- }
package/public/data2.json DELETED
@@ -1,19 +0,0 @@
1
- {
2
- "name":"Joren 2"
3
- ,"phone":[
4
- {"phone":"0948272834","name":"中華電信"}
5
- ,{"phone":"0987304555","name":"遠傳"}
6
- ]
7
- ,"dataUrl":"data.json"
8
- ,"account":"jorenlai"
9
- ,"email":"joren.lai@gmail.com"
10
- ,"address":{
11
- "no":"53-102"
12
- ,"street":"Jalan Indah"
13
- ,"postcode":"86000"
14
- ,"state":"Johor"
15
- ,"country":"Malaysia"
16
- }
17
- ,"father":"Lai"
18
- ,"mother":"Wong"
19
- }
package/public/list.json DELETED
@@ -1,132 +0,0 @@
1
- [
2
- {
3
- "name":"Joren"
4
- ,"id":1
5
- ,"phone":"097459999"
6
- ,"address":{
7
- "no":"23"
8
- ,"street":"Jalan Indah"
9
- ,"country":"Malaysia"
10
- }
11
- }
12
- ,{
13
- "name":"John"
14
- ,"id":2
15
- ,"phone":"0124873737"
16
- ,"address":{
17
- "no":"36"
18
- ,"street":"景興路"
19
- ,"country":"台灣"
20
- }
21
- }
22
- ,{
23
- "name":"Oliver"
24
- ,"id":3
25
- ,"phone":"0124873737"
26
- ,"address":{
27
- "no":"36"
28
- ,"street":"景興路"
29
- ,"country":"台灣"
30
- }
31
- }
32
- ,{
33
- "name":"Harry"
34
- ,"id":4
35
- ,"phone":"0124873737"
36
- ,"address":{
37
- "no":"36"
38
- ,"street":"景興路"
39
- ,"country":"台灣"
40
- }
41
- }
42
- ,{
43
- "name":"Jacob"
44
- ,"id":5
45
- ,"phone":"0124873737"
46
- ,"address":{
47
- "no":"36"
48
- ,"street":"景興路"
49
- ,"country":"台灣"
50
- }
51
- }
52
- ,{
53
- "name":"Charlie"
54
- ,"id":6
55
- ,"phone":"0124873737"
56
- ,"address":{
57
- "no":"36"
58
- ,"street":"景興路"
59
- ,"country":"台灣"
60
- }
61
- }
62
- ,{
63
- "name":"Thomas"
64
- ,"id":7
65
- ,"phone":"0124873737"
66
- ,"address":{
67
- "no":"36"
68
- ,"street":"景興路"
69
- ,"country":"台灣"
70
- }
71
- }
72
- ,{
73
- "name":"George"
74
- ,"id":8
75
- ,"phone":"0124873737"
76
- ,"address":{
77
- "no":"36"
78
- ,"street":"景興路"
79
- ,"country":"台灣"
80
- }
81
- }
82
- ,{
83
- "name":"Oscar"
84
- ,"id":9
85
- ,"phone":"0124873737"
86
- ,"address":{
87
- "no":"36"
88
- ,"street":"景興路"
89
- ,"country":"台灣"
90
- }
91
- }
92
- ,{
93
- "name":"James"
94
- ,"id":10
95
- ,"phone":"0124873737"
96
- ,"address":{
97
- "no":"36"
98
- ,"street":"景興路"
99
- ,"country":"台灣"
100
- }
101
- }
102
- ,{
103
- "name":"William"
104
- ,"id":11
105
- ,"phone":"0124873737"
106
- ,"address":{
107
- "no":"36"
108
- ,"street":"景興路"
109
- ,"country":"台灣"
110
- }
111
- }
112
- ,{
113
- "name":"Emily"
114
- ,"id":12
115
- ,"phone":"0124873737"
116
- ,"address":{
117
- "no":"36"
118
- ,"street":"景興路"
119
- ,"country":"台灣"
120
- }
121
- }
122
- ,{
123
- "name":"Isla"
124
- ,"id":13
125
- ,"phone":"0124873737"
126
- ,"address":{
127
- "no":"36"
128
- ,"street":"景興路"
129
- ,"country":"台灣"
130
- }
131
- }
132
- ]
package/public/vite.svg DELETED
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
package/src/app/App.css DELETED
@@ -1,42 +0,0 @@
1
-
2
-
3
- html,*,*:before,*:after {
4
- box-sizing: border-box;
5
- }
6
-
7
-
8
- .withMask{
9
- position: relative;
10
- overflow: hidden !important;
11
- user-select: none;
12
- &::after{
13
- content:'' ;
14
- background : #868686cc;
15
- a:#868686cc;
16
- position: absolute;
17
- top: 0;
18
- left: 0;
19
- right: 0;
20
- bottom: 0;
21
- border-radius: inherit;
22
- height: 10000px;
23
- width: 10000px;
24
- }
25
- }
26
-
27
- #jr-alert-div{
28
- >div:not(:last-child){
29
- display: none;
30
- }
31
- }
32
-
33
-
34
-
35
- Xdialog.jr-mask::backdrop {
36
- background: #000c6e;
37
- opacity: .3;
38
- }
39
-
40
- dialog:modal {
41
- max-width: 100vw;
42
- }
package/src/app/App.jsx DELETED
@@ -1,35 +0,0 @@
1
- import { BrowserRouter, Route, Routes ,Link} from 'react-router-dom'
2
- import './App.css'
3
- import TableApp from './table/TableApp'
4
- import FieldsApp from './fields/FieldsApp'
5
- import WindowApp from './window/WindowApp'
6
- import AxiosApp from './axios/AxiosApp'
7
- import AlertApp from './alert/AlertApp'
8
- import { po } from '../components/JRUtils'
9
- import TestApp from './test'
10
- import InputApp from './input/InputApp'
11
- import DevApp from './dev/devApp'
12
-
13
- function App() {
14
- const apps={
15
- TableApp,FieldsApp,WindowApp,AxiosApp,AlertApp,InputApp,TestApp
16
- ,DevApp
17
- }
18
- return <BrowserRouter>
19
- {
20
- Object.entries(apps).map(([key,app],index)=>{
21
- return <span key={key} style={{padding:'8px'}}><Link to={`/${key}`}>{key}</Link></span>
22
- })
23
- }
24
- <Routes>
25
- {
26
- Object.entries(apps).map(([key,App],index)=>{
27
- return <Route path={`/${key}`} element={<App/>} key={key}/>
28
- })
29
- }
30
- </Routes>
31
- {/* <div id='play' style={{width:'500px',height:'500px',border:'1px solid gray'}}> </div> */}
32
- </BrowserRouter>
33
- }
34
-
35
- export default App
package/src/app/alert/AlertApp.jsx DELETED
@@ -1,92 +0,0 @@
1
- import React, { useEffect } from "react"
2
- import { createPortal } from 'react-dom'
3
- import JRAlert from "../../components/JRAlert"
4
- import JRS from "../../components/JRS"
5
- import { po } from "../../components/JRUtils"
6
- import createClass from 'create-react-class';
7
-
8
-
9
- const Show = createClass({
10
- render: () => <h1>This is coming from createClass() function</h1>,
11
- });
12
-
13
- function AlertApp1() {
14
- useEffect(()=>{
15
-
16
- // root.render(<div>VVVVVVVVV</div>)
17
- })
18
- return <div>Alert <Show/></div>
19
- }
20
-
21
- function AlertApp() {
22
- useEffect(()=>{
23
- JRAlert({
24
- title:'Static Title'
25
- ,message:'Default message'
26
- ,x:100
27
- ,y:100
28
- })
29
-
30
- JRAlert({
31
- title:'Static Title'
32
- ,message:'Default message'
33
- ,x:200
34
- ,y:200
35
- })
36
-
37
- JRAlert({
38
- title:'Static Title'
39
- ,message:'Default message'
40
- ,x:300
41
- ,y:300
42
- })
43
-
44
- JRAlert({
45
- title:'Static Title'
46
- ,message:'Default message'
47
- ,x:400
48
- ,y:400
49
- })
50
- })
51
- return <div>
52
- <button
53
- onClick={()=>{
54
- JRAlert({
55
- title:'My alert'
56
- ,message:'Here you go'
57
- ,width:300
58
- ,height:160
59
- ,get:{
60
- url:'data.json'
61
- ,autoRun:true
62
- }
63
- })
64
- }}
65
- >Alert</button>
66
-
67
- <button
68
- onClick={()=>{
69
- JRAlert({
70
- title:'Another alert'
71
- ,message:'Here you go'
72
- })
73
- }}
74
- >Alert 2</button>
75
-
76
- <button
77
- onClick={()=>{
78
- JRAlert({
79
- title(){
80
- return this.getValue().title
81
- }
82
- ,get:{
83
- url:'alert.json'
84
- ,autoRun:true
85
- }
86
- })
87
- }}
88
- >Server</button>
89
- </div>
90
- }
91
-
92
- export default AlertApp
package/src/app/axios/AxiosApp.jsx DELETED
@@ -1,71 +0,0 @@
1
-
2
- import axios from "axios";
3
- import { useEffect } from "react";
4
- import styled from "styled-components";
5
- import { po } from "../../components/JRUtils";
6
-
7
-
8
-
9
- const StyledDiv=styled.div`
10
- input {
11
- background: #202020;
12
- color:gray;
13
- }
14
- `
15
- // const submit = axios.create({
16
- // timeout: 120000,
17
- // maxBodyLength: 104857600, //100mb 104857600
18
- // maxContentLength: 104857600, //100mb
19
- // });
20
- // axios.interceptors.response.use(
21
- // (Response) => {
22
- // po('++++++++++++++++++++++++++',Response,Response)
23
- // if(Response?.status!=200){
24
- // po('fffffffffffffffff')
25
- // return Promise.reject(Error);
26
- // }
27
- // return Promise.resolve(Response);
28
- // },
29
- // (Error) => {
30
- // po('---------------------------',Error)
31
- // return Promise.reject(Error);
32
- // }
33
- // );
34
-
35
- export default function AxiosApp() {
36
- const config = {
37
- headers:{
38
- Authorization: `Bearer AAAAA.bbbbbbbbbbbbbbbbbbbbb.ccccccccccccccc`
39
- ,'Content-Type' : 'application/json'
40
- }
41
- ,emulateJSON: true
42
- ,params: {
43
- orderNo:'M20240720001'
44
- }
45
- ,responseType: "application/json"
46
- };
47
-
48
- useEffect(()=>{
49
- axios.get('data.json'
50
- , {
51
- params:{
52
- name: "2",
53
- parts: "4"
54
- }
55
- ,...config
56
- }
57
- ,{
58
- ...config
59
- }
60
- )
61
- .then(response => {
62
- po('then')
63
- console.log(response)
64
- })
65
- .catch(error => {
66
- po('catch')
67
- console.log(error.response)
68
- });
69
- },[])
70
- return <StyledDiv>StyledDiv 3</StyledDiv>
71
- }
package/src/app/dev/devApp.jsx DELETED
@@ -1,146 +0,0 @@
1
- import { JRHTML } from "jrs-js"
2
- import { useEffect, useRef } from "react"
3
- import { po, random } from "../../components/JRUtils"
4
- import MyFunction from "./tobeimport"
5
- import JRMask, { showMask } from "../../components/JRMask/JRMask"
6
- import JRFields from "../../components/JRFields/JRFields"
7
- import JRTable from "../../components/JRTable/JRTable"
8
- import JRSelect from "../../components/JRInput/JRSelect"
9
-
10
-
11
-
12
- const removeFunctions={}
13
- export default function DevApp() {
14
- const tRef=useRef()
15
- const fRef=useRef()
16
- const sRef=useRef()
17
- const no=5
18
-
19
- useEffect(()=>{
20
- // showMask('JRMask',null,'jr-mask')
21
- },[])
22
- return <div id={'dev'}>
23
- <JRMask />
24
-
25
- <button
26
- onClick={()=>{
27
- po(random())
28
- }}
29
- >
30
- Random
31
- </button>
32
-
33
- <button
34
- onClick={()=>{
35
- const removeFunction=showMask('JRMask',null,'jr-mask')
36
- removeFunction()
37
- }}
38
- >
39
- JRMask
40
- </button>
41
-
42
- <button
43
- onClick={()=>{
44
- const removeFunction=showMask('Default')
45
- removeFunction()
46
- }}
47
- >
48
- Default
49
- </button>
50
- <br/>
51
-
52
- <button
53
- onClick={()=>{
54
- setTimeout(()=>{tRef.current.get({mask:random(2000,100)})},random(4000,100))
55
- setTimeout(()=>{fRef.current.get()},random(3000,100))
56
- setTimeout(()=>{sRef.current.get()},random(2000,100))
57
- }}
58
- >
59
- Get all
60
- </button>
61
- <br/>
62
- {
63
- Array(no).fill().map((f,a,i)=>{
64
- return <button
65
- key={a}
66
- onClick={()=>{
67
- removeFunctions[a]=showMask(`message ${a}`,null,'jr-mask')
68
-
69
- }}
70
- >
71
- Add {a}
72
- </button>
73
- })
74
- }
75
- <br/>
76
- {
77
- Array(no).fill().map((f,a,i)=>{
78
- return <button
79
- key={a}
80
- onClick={()=>{
81
- removeFunctions[a]?.()
82
- }}
83
- >
84
- del {a}
85
- </button>
86
- })
87
- }
88
- <JRFields
89
- ref={fRef}
90
- get={{
91
- url:'data.json'
92
- // ,autoRun:true
93
- ,mask:'JRFields loading'
94
- }}
95
- columns={[
96
- {name:'name'}
97
- ]}
98
- left={function(){
99
- return <div>
100
- <button
101
- onClick={()=>{
102
- this.get({
103
- mask:'Field is loading'
104
- })
105
- }}
106
- >Get</button>
107
- </div>
108
- }}
109
- />
110
- <JRTable
111
- ref={tRef}
112
- get={{
113
- url:'list.json'
114
- // ,autoRun:true
115
- ,mask:'JRTable loading'
116
- }}
117
- style={{
118
- height:'50px'
119
- }}
120
- columns={[
121
- {name:'name'}
122
- ]}
123
- left={function(){
124
- return <div>
125
- <button
126
- onClick={()=>{
127
- this.get({
128
- mask:'Table is loading'
129
- })
130
- }}
131
- >Get</button>
132
- </div>
133
- }}
134
- />
135
- <JRSelect
136
- ref={sRef}
137
- get={{
138
- url:'list.json'
139
- ,autoRun:true
140
- ,mask:'JRSelect is loading'
141
- }}
142
- labelName={'name'}
143
- valueName={'id'}
144
- />
145
- </div>
146
- }
package/src/app/dev/tobeimport.js DELETED
@@ -1,7 +0,0 @@
1
- import { po } from "../../components/JRUtils"
2
-
3
- export default function MyFunction(){
4
- return 'MyFunction'
5
- }
6
-
7
- po('import -----------------')
package/src/app/fields/FieldsApp.jsx DELETED
@@ -1,46 +0,0 @@
1
-
2
- import styled from "styled-components";
3
- import JRFields from "../../components/JRFields/JRFields";
4
- import { devFields, withSomeButton } from "./fieldsConfig";
5
-
6
- const StyledJRFields=styled(JRFields)`
7
- >Xmain{
8
- >main{
9
- >main{
10
- >main{
11
- >.jr-grid{
12
- padding:0;
13
- margin:10px;
14
- gap:0;
15
- border-top: 1px solid white;
16
- border-right: 1px solid white;
17
-
18
- >.jr-column{
19
- border-bottom:1px solid white;
20
- border-left:1px solid white;
21
- padding:10px ;
22
- }
23
- }
24
-
25
- }
26
- }
27
- }
28
- }
29
-
30
- `
31
- export default function FieldsApp() {
32
- return <>
33
- <StyledJRFields
34
- initValue={{
35
- checkbox:[1,3,5]
36
- ,select:[2]
37
- }}
38
- {...devFields}
39
- {...withSomeButton}
40
- open={true}
41
- popup={false}
42
- width={900}
43
- title={'Fields'}
44
- />
45
- </>
46
- }