@fixefy/fixefy-ui-components 0.2.93 → 0.2.94
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.
- package/dist/FxModalWithComponent/FxModalWithComponent.d.ts +10 -0
- package/dist/FxModalWithComponent/FxModalWithComponent.js +121 -0
- package/dist/FxModalWithComponent/index.d.ts +1 -0
- package/dist/FxModalWithComponent/index.js +11 -0
- package/dist/FxModalWithMenu/FxModalWithMenu.d.ts +10 -0
- package/dist/FxModalWithMenu/FxModalWithMenu.js +131 -0
- package/dist/FxModalWithMenu/index.d.ts +1 -0
- package/dist/FxModalWithMenu/index.js +11 -0
- package/dist/index.d.ts +2 -1
- package/dist/index.js +7 -3
- package/package.json +1 -1
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const FxModalWithComponent: ({ btnType, color, btnValue, modalData, onClick, disabled, icon, }: {
|
|
3
|
+
btnType?: 'text' | 'icon';
|
|
4
|
+
color?: 'secondary' | undefined;
|
|
5
|
+
btnValue?: string;
|
|
6
|
+
modalData: any;
|
|
7
|
+
onClick?: any;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
icon?: string;
|
|
10
|
+
}) => React.JSX.Element;
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxModalWithComponent", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return FxModalWithComponent;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _jsxruntime = require("react/jsx-runtime");
|
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
|
|
13
|
+
const _material = require("@mui/material");
|
|
14
|
+
const _FxIcon = require("../FxIcon");
|
|
15
|
+
function _getRequireWildcardCache(nodeInterop) {
|
|
16
|
+
if (typeof WeakMap !== "function") return null;
|
|
17
|
+
var cacheBabelInterop = new WeakMap();
|
|
18
|
+
var cacheNodeInterop = new WeakMap();
|
|
19
|
+
return (_getRequireWildcardCache = function(nodeInterop) {
|
|
20
|
+
return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
|
|
21
|
+
})(nodeInterop);
|
|
22
|
+
}
|
|
23
|
+
function _interop_require_wildcard(obj, nodeInterop) {
|
|
24
|
+
if (!nodeInterop && obj && obj.__esModule) {
|
|
25
|
+
return obj;
|
|
26
|
+
}
|
|
27
|
+
if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
|
|
28
|
+
return {
|
|
29
|
+
default: obj
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
var cache = _getRequireWildcardCache(nodeInterop);
|
|
33
|
+
if (cache && cache.has(obj)) {
|
|
34
|
+
return cache.get(obj);
|
|
35
|
+
}
|
|
36
|
+
var newObj = {
|
|
37
|
+
__proto__: null
|
|
38
|
+
};
|
|
39
|
+
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
40
|
+
for(var key in obj){
|
|
41
|
+
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
42
|
+
var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
|
|
43
|
+
if (desc && (desc.get || desc.set)) {
|
|
44
|
+
Object.defineProperty(newObj, key, desc);
|
|
45
|
+
} else {
|
|
46
|
+
newObj[key] = obj[key];
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
newObj.default = obj;
|
|
51
|
+
if (cache) {
|
|
52
|
+
cache.set(obj, newObj);
|
|
53
|
+
}
|
|
54
|
+
return newObj;
|
|
55
|
+
}
|
|
56
|
+
const FxModalWithComponent = ({ btnType = 'text', color, btnValue, modalData, onClick, disabled, icon })=>{
|
|
57
|
+
const [isOpen, setIsOpen] = (0, _react.useState)(false);
|
|
58
|
+
const [AnchorEl, setAnchorEl] = (0, _react.useState)(null);
|
|
59
|
+
const handleClick = (e)=>{
|
|
60
|
+
if (onClick) {
|
|
61
|
+
onClick();
|
|
62
|
+
setIsOpen((prev)=>!prev);
|
|
63
|
+
setAnchorEl(e.currentTarget);
|
|
64
|
+
} else {
|
|
65
|
+
setIsOpen((prev)=>!prev);
|
|
66
|
+
setAnchorEl(e.currentTarget);
|
|
67
|
+
}
|
|
68
|
+
};
|
|
69
|
+
const handleClose = ()=>{
|
|
70
|
+
setIsOpen(false);
|
|
71
|
+
setAnchorEl(null);
|
|
72
|
+
};
|
|
73
|
+
(0, _react.useEffect)(()=>{
|
|
74
|
+
setIsOpen(false);
|
|
75
|
+
}, [
|
|
76
|
+
btnValue
|
|
77
|
+
]);
|
|
78
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
|
|
79
|
+
children: [
|
|
80
|
+
btnType == 'text' && /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
|
|
81
|
+
disabled: disabled,
|
|
82
|
+
color: color || 'primary',
|
|
83
|
+
id: "fade-button",
|
|
84
|
+
"aria-haspopup": "true",
|
|
85
|
+
onClick: handleClick,
|
|
86
|
+
sx: {
|
|
87
|
+
fontWeight: 'normal',
|
|
88
|
+
width: '100%',
|
|
89
|
+
justifyContent: 'flex-start',
|
|
90
|
+
'&:disabled': {
|
|
91
|
+
color: '#BDBDBD',
|
|
92
|
+
backgroundColor: '#F0F0F0'
|
|
93
|
+
}
|
|
94
|
+
},
|
|
95
|
+
children: btnValue
|
|
96
|
+
}),
|
|
97
|
+
btnType == 'icon' && icon && /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.IconButton, {
|
|
98
|
+
onClick: handleClick,
|
|
99
|
+
children: [
|
|
100
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(_FxIcon.FxIcon, {
|
|
101
|
+
icon: icon,
|
|
102
|
+
width: 20,
|
|
103
|
+
height: 20
|
|
104
|
+
}),
|
|
105
|
+
' '
|
|
106
|
+
]
|
|
107
|
+
}),
|
|
108
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Menu, {
|
|
109
|
+
id: "fade-menu",
|
|
110
|
+
MenuListProps: {
|
|
111
|
+
'aria-labelledby': 'fade-button'
|
|
112
|
+
},
|
|
113
|
+
anchorEl: AnchorEl,
|
|
114
|
+
open: isOpen,
|
|
115
|
+
onClose: handleClose,
|
|
116
|
+
TransitionComponent: _material.Fade,
|
|
117
|
+
children: isOpen && modalData
|
|
118
|
+
})
|
|
119
|
+
]
|
|
120
|
+
});
|
|
121
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { FxModalWithComponent } from './FxModalWithComponent';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxModalWithComponent", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return _FxModalWithComponent.FxModalWithComponent;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _FxModalWithComponent = require("./FxModalWithComponent");
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const FxModalWithMenu: ({ btnType, color, btnValue, modalData, onClick, disabled, icon, }: {
|
|
3
|
+
btnType?: 'text' | 'icon';
|
|
4
|
+
color?: 'secondary' | undefined;
|
|
5
|
+
btnValue?: string;
|
|
6
|
+
modalData: any;
|
|
7
|
+
onClick?: any;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
icon?: string;
|
|
10
|
+
}) => React.JSX.Element;
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxModalWithMenu", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return FxModalWithMenu;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _jsxruntime = require("react/jsx-runtime");
|
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
|
|
13
|
+
const _material = require("@mui/material");
|
|
14
|
+
const _FxIcon = require("../FxIcon");
|
|
15
|
+
const _FxMenuItemWithIcon = require("../FxMenuItemWithIcon");
|
|
16
|
+
function _getRequireWildcardCache(nodeInterop) {
|
|
17
|
+
if (typeof WeakMap !== "function") return null;
|
|
18
|
+
var cacheBabelInterop = new WeakMap();
|
|
19
|
+
var cacheNodeInterop = new WeakMap();
|
|
20
|
+
return (_getRequireWildcardCache = function(nodeInterop) {
|
|
21
|
+
return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
|
|
22
|
+
})(nodeInterop);
|
|
23
|
+
}
|
|
24
|
+
function _interop_require_wildcard(obj, nodeInterop) {
|
|
25
|
+
if (!nodeInterop && obj && obj.__esModule) {
|
|
26
|
+
return obj;
|
|
27
|
+
}
|
|
28
|
+
if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
|
|
29
|
+
return {
|
|
30
|
+
default: obj
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
var cache = _getRequireWildcardCache(nodeInterop);
|
|
34
|
+
if (cache && cache.has(obj)) {
|
|
35
|
+
return cache.get(obj);
|
|
36
|
+
}
|
|
37
|
+
var newObj = {
|
|
38
|
+
__proto__: null
|
|
39
|
+
};
|
|
40
|
+
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
41
|
+
for(var key in obj){
|
|
42
|
+
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
43
|
+
var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
|
|
44
|
+
if (desc && (desc.get || desc.set)) {
|
|
45
|
+
Object.defineProperty(newObj, key, desc);
|
|
46
|
+
} else {
|
|
47
|
+
newObj[key] = obj[key];
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
newObj.default = obj;
|
|
52
|
+
if (cache) {
|
|
53
|
+
cache.set(obj, newObj);
|
|
54
|
+
}
|
|
55
|
+
return newObj;
|
|
56
|
+
}
|
|
57
|
+
const FxModalWithMenu = ({ btnType = 'text', color, btnValue, modalData, onClick, disabled, icon })=>{
|
|
58
|
+
const [isOpen, setIsOpen] = (0, _react.useState)(false);
|
|
59
|
+
const [AnchorEl, setAnchorEl] = (0, _react.useState)(null);
|
|
60
|
+
const handleClick = (e)=>{
|
|
61
|
+
if (onClick) {
|
|
62
|
+
onClick();
|
|
63
|
+
setIsOpen((prev)=>!prev);
|
|
64
|
+
setAnchorEl(e.currentTarget);
|
|
65
|
+
} else {
|
|
66
|
+
setIsOpen((prev)=>!prev);
|
|
67
|
+
setAnchorEl(e.currentTarget);
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
const handleClose = ()=>{
|
|
71
|
+
setIsOpen(false);
|
|
72
|
+
setAnchorEl(null);
|
|
73
|
+
};
|
|
74
|
+
(0, _react.useEffect)(()=>{
|
|
75
|
+
setIsOpen(false);
|
|
76
|
+
}, [
|
|
77
|
+
btnValue
|
|
78
|
+
]);
|
|
79
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
|
|
80
|
+
children: [
|
|
81
|
+
btnType == 'text' && /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
|
|
82
|
+
disabled: disabled,
|
|
83
|
+
color: color || 'primary',
|
|
84
|
+
id: "fade-button",
|
|
85
|
+
"aria-haspopup": "true",
|
|
86
|
+
onClick: handleClick,
|
|
87
|
+
sx: {
|
|
88
|
+
fontWeight: 'normal',
|
|
89
|
+
width: '100%',
|
|
90
|
+
justifyContent: 'flex-start',
|
|
91
|
+
'&:disabled': {
|
|
92
|
+
color: '#BDBDBD',
|
|
93
|
+
backgroundColor: '#F0F0F0'
|
|
94
|
+
}
|
|
95
|
+
},
|
|
96
|
+
children: btnValue
|
|
97
|
+
}),
|
|
98
|
+
btnType == 'icon' && icon && /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.IconButton, {
|
|
99
|
+
onClick: handleClick,
|
|
100
|
+
children: [
|
|
101
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(_FxIcon.FxIcon, {
|
|
102
|
+
icon: icon,
|
|
103
|
+
width: 20,
|
|
104
|
+
height: 20
|
|
105
|
+
}),
|
|
106
|
+
' '
|
|
107
|
+
]
|
|
108
|
+
}),
|
|
109
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Menu, {
|
|
110
|
+
id: "fade-menu",
|
|
111
|
+
MenuListProps: {
|
|
112
|
+
'aria-labelledby': 'fade-button'
|
|
113
|
+
},
|
|
114
|
+
anchorEl: AnchorEl,
|
|
115
|
+
open: isOpen,
|
|
116
|
+
onClose: handleClose,
|
|
117
|
+
TransitionComponent: _material.Fade,
|
|
118
|
+
children: isOpen && (modalData === null || modalData === void 0 ? void 0 : modalData.map((item, i)=>{
|
|
119
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_FxMenuItemWithIcon.FxMenuItemWithIcon, {
|
|
120
|
+
icon: item.icon,
|
|
121
|
+
title: item.title,
|
|
122
|
+
onClick: ()=>{
|
|
123
|
+
handleClose();
|
|
124
|
+
item.onClick();
|
|
125
|
+
}
|
|
126
|
+
}, i);
|
|
127
|
+
}))
|
|
128
|
+
})
|
|
129
|
+
]
|
|
130
|
+
});
|
|
131
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { FxModalWithMenu } from './FxModalWithMenu';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxModalWithMenu", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return _FxModalWithMenu.FxModalWithMenu;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _FxModalWithMenu = require("./FxModalWithMenu");
|
package/dist/index.d.ts
CHANGED
|
@@ -8,7 +8,8 @@ export { FxChip, ChipPropsType } from './FxChip';
|
|
|
8
8
|
export { FxIcon } from './FxIcon';
|
|
9
9
|
export { FxMenuItemWithIcon } from './FxMenuItemWithIcon';
|
|
10
10
|
export { FxModal, ModalPropsType } from './FxModal';
|
|
11
|
-
export {
|
|
11
|
+
export { FxModalWithComponent } from './FxModalWithComponent';
|
|
12
|
+
export { FxModalWithMenu } from './FxModalWithMenu';
|
|
12
13
|
export { FxNotes, NoteCreateInput, NotesPropsType } from './FxNotes';
|
|
13
14
|
export { FxNumberField, NumberfieldPropsType } from './FxNumberField';
|
|
14
15
|
export { FxProgressCircle, ProgressCirclePropsType } from './FxProgressCircle';
|
package/dist/index.js
CHANGED
|
@@ -75,8 +75,11 @@ _export(exports, {
|
|
|
75
75
|
FxModal: function() {
|
|
76
76
|
return _FxModal.FxModal;
|
|
77
77
|
},
|
|
78
|
-
|
|
79
|
-
return
|
|
78
|
+
FxModalWithComponent: function() {
|
|
79
|
+
return _FxModalWithComponent.FxModalWithComponent;
|
|
80
|
+
},
|
|
81
|
+
FxModalWithMenu: function() {
|
|
82
|
+
return _FxModalWithMenu.FxModalWithMenu;
|
|
80
83
|
},
|
|
81
84
|
FxNotes: function() {
|
|
82
85
|
return _FxNotes.FxNotes;
|
|
@@ -218,7 +221,8 @@ const _FxChip = require("./FxChip");
|
|
|
218
221
|
const _FxIcon = require("./FxIcon");
|
|
219
222
|
const _FxMenuItemWithIcon = require("./FxMenuItemWithIcon");
|
|
220
223
|
const _FxModal = require("./FxModal");
|
|
221
|
-
const
|
|
224
|
+
const _FxModalWithComponent = require("./FxModalWithComponent");
|
|
225
|
+
const _FxModalWithMenu = require("./FxModalWithMenu");
|
|
222
226
|
const _FxNotes = require("./FxNotes");
|
|
223
227
|
const _FxNumberField = require("./FxNumberField");
|
|
224
228
|
const _FxProgressCircle = require("./FxProgressCircle");
|
package/package.json
CHANGED