@fixefy/fixefy-ui-components 0.3.29 → 0.3.30
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/FxButtonModalWithComponent/FxButtonModalWithComponent.d.ts +11 -0
- package/dist/FxButtonModalWithComponent/FxButtonModalWithComponent.js +102 -0
- package/dist/FxButtonModalWithComponent/index.d.ts +1 -0
- package/dist/FxButtonModalWithComponent/index.js +11 -0
- package/dist/FxButtonModalWithMenu/FxButtonModalWithMenu.d.ts +14 -0
- package/dist/FxButtonModalWithMenu/FxButtonModalWithMenu.js +114 -0
- package/dist/FxButtonModalWithMenu/index.d.ts +1 -0
- package/dist/FxButtonModalWithMenu/index.js +11 -0
- package/dist/index.d.ts +2 -2
- package/dist/index.js +8 -8
- package/package.json +1 -1
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const FxButtonModalWithComponent: ({ btnType, btnValue, modalData, onClick, disabled, icon, sx, iconSize, }: {
|
|
3
|
+
btnType?: 'text' | 'icon';
|
|
4
|
+
btnValue?: string;
|
|
5
|
+
modalData: any;
|
|
6
|
+
onClick?: any;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
icon?: string;
|
|
9
|
+
sx?: any;
|
|
10
|
+
iconSize?: number;
|
|
11
|
+
}) => React.JSX.Element;
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxButtonModalWithComponent", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return FxButtonModalWithComponent;
|
|
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 _FxStyledButton = require("../FxStyledButton");
|
|
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 FxButtonModalWithComponent = ({ btnType = 'text', btnValue, modalData, onClick, disabled, icon, sx, iconSize })=>{
|
|
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
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(_FxStyledButton.FxStyledButton, {
|
|
81
|
+
sx: sx,
|
|
82
|
+
btnType: btnType,
|
|
83
|
+
btnValue: btnValue,
|
|
84
|
+
onClick: handleClick,
|
|
85
|
+
startIcon: icon,
|
|
86
|
+
disabled: disabled,
|
|
87
|
+
iconSize: iconSize || 20
|
|
88
|
+
}),
|
|
89
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Menu, {
|
|
90
|
+
id: "fade-menu",
|
|
91
|
+
MenuListProps: {
|
|
92
|
+
'aria-labelledby': 'fade-button'
|
|
93
|
+
},
|
|
94
|
+
anchorEl: AnchorEl,
|
|
95
|
+
open: isOpen,
|
|
96
|
+
onClose: handleClose,
|
|
97
|
+
TransitionComponent: _material.Fade,
|
|
98
|
+
children: isOpen && modalData
|
|
99
|
+
})
|
|
100
|
+
]
|
|
101
|
+
});
|
|
102
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { FxButtonModalWithComponent } from './FxButtonModalWithComponent';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxButtonModalWithComponent", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return _FxButtonModalWithComponent.FxButtonModalWithComponent;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _FxButtonModalWithComponent = require("./FxButtonModalWithComponent");
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const FxButtonModalWithMenu: ({ btnType, btnValue, modalData, onClick, disabled, startIcon, endIcon, shouldShowModal, buttonSx, menuItemSx, iconSize, }: {
|
|
3
|
+
btnType?: 'text' | 'icon';
|
|
4
|
+
btnValue?: string;
|
|
5
|
+
modalData: any;
|
|
6
|
+
onClick?: any;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
startIcon?: string;
|
|
9
|
+
endIcon?: string;
|
|
10
|
+
shouldShowModal?: boolean;
|
|
11
|
+
buttonSx?: any;
|
|
12
|
+
menuItemSx?: any;
|
|
13
|
+
iconSize?: number;
|
|
14
|
+
}) => React.JSX.Element;
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxButtonModalWithMenu", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return FxButtonModalWithMenu;
|
|
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 _FxMenuItemWithIcon = require("../FxMenuItemWithIcon");
|
|
15
|
+
const _FxStyledButton = require("../FxStyledButton");
|
|
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 FxButtonModalWithMenu = ({ btnType = 'text', btnValue, modalData, onClick, disabled, startIcon, endIcon, shouldShowModal = true, buttonSx, menuItemSx, iconSize })=>{
|
|
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
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(_FxStyledButton.FxStyledButton, {
|
|
82
|
+
sx: buttonSx,
|
|
83
|
+
btnType: btnType,
|
|
84
|
+
btnValue: btnValue,
|
|
85
|
+
onClick: handleClick,
|
|
86
|
+
startIcon: startIcon,
|
|
87
|
+
endIcon: endIcon,
|
|
88
|
+
iconSize: iconSize || 20,
|
|
89
|
+
disabled: disabled
|
|
90
|
+
}),
|
|
91
|
+
shouldShowModal && /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Menu, {
|
|
92
|
+
id: "fade-menu",
|
|
93
|
+
MenuListProps: {
|
|
94
|
+
'aria-labelledby': 'fade-button'
|
|
95
|
+
},
|
|
96
|
+
anchorEl: AnchorEl,
|
|
97
|
+
open: isOpen,
|
|
98
|
+
onClose: handleClose,
|
|
99
|
+
TransitionComponent: _material.Fade,
|
|
100
|
+
children: isOpen && (modalData === null || modalData === void 0 ? void 0 : modalData.map((item, i)=>{
|
|
101
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_FxMenuItemWithIcon.FxMenuItemWithIcon, {
|
|
102
|
+
icon: item.icon,
|
|
103
|
+
title: item.title,
|
|
104
|
+
onClick: ()=>{
|
|
105
|
+
handleClose();
|
|
106
|
+
item.onClick();
|
|
107
|
+
},
|
|
108
|
+
sx: menuItemSx
|
|
109
|
+
}, i);
|
|
110
|
+
}))
|
|
111
|
+
})
|
|
112
|
+
]
|
|
113
|
+
});
|
|
114
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { FxButtonModalWithMenu } from './FxButtonModalWithMenu';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "FxButtonModalWithMenu", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return _FxButtonModalWithMenu.FxButtonModalWithMenu;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _FxButtonModalWithMenu = require("./FxButtonModalWithMenu");
|
package/dist/index.d.ts
CHANGED
|
@@ -9,8 +9,8 @@ export { FxGeneralModal } from './FxGeneralModal';
|
|
|
9
9
|
export { FxIcon } from './FxIcon';
|
|
10
10
|
export { FxMenuItemWithIcon } from './FxMenuItemWithIcon';
|
|
11
11
|
export { FxModal, ModalPropsType } from './FxModal';
|
|
12
|
-
export {
|
|
13
|
-
export {
|
|
12
|
+
export { FxButtonModalWithComponent } from './FxButtonModalWithComponent';
|
|
13
|
+
export { FxButtonModalWithMenu } from './FxButtonModalWithMenu';
|
|
14
14
|
export { FxNotes, NoteCreateInput, NotesPropsType } from './FxNotes';
|
|
15
15
|
export { FxNumberField, NumberfieldPropsType } from './FxNumberField';
|
|
16
16
|
export { Arrow, PopperHeader, PopperWithOutside } from './FxPopper';
|
package/dist/index.js
CHANGED
|
@@ -60,6 +60,12 @@ _export(exports, {
|
|
|
60
60
|
FxButton: function() {
|
|
61
61
|
return _FxButton.FxButton;
|
|
62
62
|
},
|
|
63
|
+
FxButtonModalWithComponent: function() {
|
|
64
|
+
return _FxButtonModalWithComponent.FxButtonModalWithComponent;
|
|
65
|
+
},
|
|
66
|
+
FxButtonModalWithMenu: function() {
|
|
67
|
+
return _FxButtonModalWithMenu.FxButtonModalWithMenu;
|
|
68
|
+
},
|
|
63
69
|
FxChip: function() {
|
|
64
70
|
return _FxChip.FxChip;
|
|
65
71
|
},
|
|
@@ -78,12 +84,6 @@ _export(exports, {
|
|
|
78
84
|
FxModal: function() {
|
|
79
85
|
return _FxModal.FxModal;
|
|
80
86
|
},
|
|
81
|
-
FxModalWithComponent: function() {
|
|
82
|
-
return _FxModalWithComponent.FxModalWithComponent;
|
|
83
|
-
},
|
|
84
|
-
FxModalWithMenu: function() {
|
|
85
|
-
return _FxModalWithMenu.FxModalWithMenu;
|
|
86
|
-
},
|
|
87
87
|
FxNotes: function() {
|
|
88
88
|
return _FxNotes.FxNotes;
|
|
89
89
|
},
|
|
@@ -240,8 +240,8 @@ const _FxGeneralModal = require("./FxGeneralModal");
|
|
|
240
240
|
const _FxIcon = require("./FxIcon");
|
|
241
241
|
const _FxMenuItemWithIcon = require("./FxMenuItemWithIcon");
|
|
242
242
|
const _FxModal = require("./FxModal");
|
|
243
|
-
const
|
|
244
|
-
const
|
|
243
|
+
const _FxButtonModalWithComponent = require("./FxButtonModalWithComponent");
|
|
244
|
+
const _FxButtonModalWithMenu = require("./FxButtonModalWithMenu");
|
|
245
245
|
const _FxNotes = require("./FxNotes");
|
|
246
246
|
const _FxNumberField = require("./FxNumberField");
|
|
247
247
|
const _FxPopper = require("./FxPopper");
|
package/package.json
CHANGED