@portnet/ui 2.0.7 → 2.0.8
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/components/buttons/PuiNewUserButton.js +121 -0
- package/dist/components/inputs/PuiSelect.js +14 -2
- package/dist/components/others/PuiChip.js +254 -114
- package/dist/components/table/PuiTable.js +50 -8
- package/dist/components/ui/layout/Header.js +253 -0
- package/dist/components/ui/layout/Layout.js +104 -0
- package/dist/components/ui/layout/Sidebar.js +193 -0
- package/dist/components/ui/layout/index.js +29 -0
- package/dist/index.js +37 -1
- package/package.json +1 -1
|
@@ -0,0 +1,193 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
require("core-js/modules/esnext.iterator.filter.js");
|
|
4
|
+
require("core-js/modules/esnext.iterator.for-each.js");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
require("core-js/modules/esnext.iterator.constructor.js");
|
|
10
|
+
require("core-js/modules/esnext.iterator.map.js");
|
|
11
|
+
var _react = _interopRequireDefault(require("react"));
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
var _styles = require("@mui/material/styles");
|
|
14
|
+
var _material = require("@mui/material");
|
|
15
|
+
var _iconsMaterial = require("@mui/icons-material");
|
|
16
|
+
var _apperance = require("../../../config/apperance");
|
|
17
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
18
|
+
const _excluded = ["items", "logoUrl", "appName", "userName", "userRole", "onLogout", "activeItemId"]; // Largeur augmentée
|
|
19
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
20
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
21
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
22
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
23
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
24
|
+
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
25
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
26
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
27
|
+
const SIDEBAR_WIDTH = 280; // Largeur augmentée (anciennement 254px)
|
|
28
|
+
|
|
29
|
+
// Composant stylisé pour la barre latérale
|
|
30
|
+
const SidebarContainer = (0, _styles.styled)(_material.Box)(_ref => {
|
|
31
|
+
let {
|
|
32
|
+
theme
|
|
33
|
+
} = _ref;
|
|
34
|
+
return {
|
|
35
|
+
width: SIDEBAR_WIDTH,
|
|
36
|
+
height: '100vh',
|
|
37
|
+
position: 'fixed',
|
|
38
|
+
left: 0,
|
|
39
|
+
top: 0,
|
|
40
|
+
backgroundColor: _apperance.palette.white,
|
|
41
|
+
borderRight: "1px solid ".concat(_apperance.palette.gray.light),
|
|
42
|
+
boxShadow: 'none',
|
|
43
|
+
display: 'flex',
|
|
44
|
+
flexDirection: 'column',
|
|
45
|
+
zIndex: 1200,
|
|
46
|
+
overflow: 'hidden',
|
|
47
|
+
transition: 'width 0.3s ease'
|
|
48
|
+
};
|
|
49
|
+
});
|
|
50
|
+
|
|
51
|
+
// En-tête de la barre latérale
|
|
52
|
+
const SidebarHeader = (0, _styles.styled)(_material.Box)({
|
|
53
|
+
padding: '16px',
|
|
54
|
+
display: 'flex',
|
|
55
|
+
alignItems: 'center',
|
|
56
|
+
justifyContent: 'space-between',
|
|
57
|
+
borderBottom: "1px solid ".concat(_apperance.palette.gray.light)
|
|
58
|
+
});
|
|
59
|
+
|
|
60
|
+
// Contenu de la barre latérale
|
|
61
|
+
const SidebarContent = (0, _styles.styled)(_material.Box)({
|
|
62
|
+
flex: 1,
|
|
63
|
+
overflowY: 'auto',
|
|
64
|
+
padding: '8px 0'
|
|
65
|
+
});
|
|
66
|
+
|
|
67
|
+
// Pied de la barre latérale
|
|
68
|
+
const SidebarFooter = (0, _styles.styled)(_material.Box)({
|
|
69
|
+
padding: '12px',
|
|
70
|
+
borderTop: "1px solid ".concat(_apperance.palette.gray.light),
|
|
71
|
+
display: 'flex',
|
|
72
|
+
alignItems: 'center',
|
|
73
|
+
justifyContent: 'space-between'
|
|
74
|
+
});
|
|
75
|
+
|
|
76
|
+
// Item de menu stylisé
|
|
77
|
+
const StyledListItem = (0, _styles.styled)(_material.ListItem)({
|
|
78
|
+
padding: '8px 16px',
|
|
79
|
+
borderRadius: '4px',
|
|
80
|
+
margin: '2px 8px',
|
|
81
|
+
transition: 'all 0.2s ease',
|
|
82
|
+
'&:hover': {
|
|
83
|
+
backgroundColor: "".concat(_apperance.palette.primary, "08"),
|
|
84
|
+
'& .MuiListItemIcon-root': {
|
|
85
|
+
color: _apperance.palette.primary
|
|
86
|
+
},
|
|
87
|
+
'& .MuiListItemText-root': {
|
|
88
|
+
color: _apperance.palette.primary
|
|
89
|
+
}
|
|
90
|
+
},
|
|
91
|
+
'&.active': {
|
|
92
|
+
backgroundColor: "".concat(_apperance.palette.primary, "10"),
|
|
93
|
+
'& .MuiListItemIcon-root': {
|
|
94
|
+
color: _apperance.palette.primary
|
|
95
|
+
},
|
|
96
|
+
'& .MuiListItemText-root': {
|
|
97
|
+
color: _apperance.palette.primary
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
});
|
|
101
|
+
|
|
102
|
+
// Icône de déconnexion stylisée
|
|
103
|
+
const LogoutButton = (0, _styles.styled)(_material.IconButton)({
|
|
104
|
+
color: _apperance.palette.gray.dark,
|
|
105
|
+
padding: '6px',
|
|
106
|
+
transition: 'all 0.2s ease',
|
|
107
|
+
'&:hover': {
|
|
108
|
+
color: _apperance.palette.error,
|
|
109
|
+
backgroundColor: "".concat(_apperance.palette.error, "08")
|
|
110
|
+
}
|
|
111
|
+
});
|
|
112
|
+
|
|
113
|
+
/**
|
|
114
|
+
* Composant Sidebar - Barre latérale de navigation
|
|
115
|
+
*/
|
|
116
|
+
const Sidebar = _ref2 => {
|
|
117
|
+
let {
|
|
118
|
+
items,
|
|
119
|
+
logoUrl,
|
|
120
|
+
appName,
|
|
121
|
+
userName,
|
|
122
|
+
userRole,
|
|
123
|
+
onLogout,
|
|
124
|
+
activeItemId
|
|
125
|
+
} = _ref2,
|
|
126
|
+
props = _objectWithoutProperties(_ref2, _excluded);
|
|
127
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(SidebarContainer, _objectSpread(_objectSpread({}, props), {}, {
|
|
128
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SidebarHeader, {
|
|
129
|
+
children: logoUrl ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
130
|
+
src: logoUrl,
|
|
131
|
+
alt: appName,
|
|
132
|
+
style: {
|
|
133
|
+
height: 40
|
|
134
|
+
}
|
|
135
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
|
|
136
|
+
variant: "h6",
|
|
137
|
+
fontWeight: "bold",
|
|
138
|
+
children: appName || 'Application'
|
|
139
|
+
})
|
|
140
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(SidebarContent, {
|
|
141
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.List, {
|
|
142
|
+
component: "nav",
|
|
143
|
+
children: items && items.map(item => /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledListItem, {
|
|
144
|
+
button: true,
|
|
145
|
+
onClick: item.onClick,
|
|
146
|
+
className: activeItemId === item.id ? 'active' : '',
|
|
147
|
+
children: [item.icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemIcon, {
|
|
148
|
+
children: item.icon
|
|
149
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ListItemText, {
|
|
150
|
+
primary: item.label,
|
|
151
|
+
primaryTypographyProps: {
|
|
152
|
+
fontSize: '0.9rem',
|
|
153
|
+
fontWeight: activeItemId === item.id ? 'bold' : 'normal'
|
|
154
|
+
}
|
|
155
|
+
})]
|
|
156
|
+
}, item.id))
|
|
157
|
+
})
|
|
158
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(SidebarFooter, {
|
|
159
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
|
|
160
|
+
display: "flex",
|
|
161
|
+
flexDirection: "column",
|
|
162
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
|
|
163
|
+
variant: "subtitle2",
|
|
164
|
+
fontWeight: "bold",
|
|
165
|
+
children: userName || 'Utilisateur'
|
|
166
|
+
}), userRole && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
|
|
167
|
+
variant: "caption",
|
|
168
|
+
color: "textSecondary",
|
|
169
|
+
children: userRole
|
|
170
|
+
})]
|
|
171
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(LogoutButton, {
|
|
172
|
+
onClick: onLogout,
|
|
173
|
+
title: "D\xE9connexion",
|
|
174
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsMaterial.ExitToApp, {}), " "]
|
|
175
|
+
})]
|
|
176
|
+
})]
|
|
177
|
+
}));
|
|
178
|
+
};
|
|
179
|
+
Sidebar.propTypes = {
|
|
180
|
+
items: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
181
|
+
id: _propTypes.default.string.isRequired,
|
|
182
|
+
label: _propTypes.default.string.isRequired,
|
|
183
|
+
icon: _propTypes.default.node,
|
|
184
|
+
onClick: _propTypes.default.func
|
|
185
|
+
})),
|
|
186
|
+
logoUrl: _propTypes.default.string,
|
|
187
|
+
appName: _propTypes.default.string,
|
|
188
|
+
userName: _propTypes.default.string,
|
|
189
|
+
userRole: _propTypes.default.string,
|
|
190
|
+
onLogout: _propTypes.default.func,
|
|
191
|
+
activeItemId: _propTypes.default.string
|
|
192
|
+
};
|
|
193
|
+
var _default = exports.default = Sidebar;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "Header", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _Header.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "Layout", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _Layout.default;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
Object.defineProperty(exports, "Sidebar", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function get() {
|
|
21
|
+
return _Sidebar.default;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
exports.default = void 0;
|
|
25
|
+
var _Layout = _interopRequireDefault(require("./Layout"));
|
|
26
|
+
var _Sidebar = _interopRequireDefault(require("./Sidebar"));
|
|
27
|
+
var _Header = _interopRequireDefault(require("./Header"));
|
|
28
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
29
|
+
var _default = exports.default = _Layout.default;
|
package/dist/index.js
CHANGED
|
@@ -1,8 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
require("core-js/modules/es.weak-map.js");
|
|
4
|
+
require("core-js/modules/web.dom-collections.iterator.js");
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
8
|
+
Object.defineProperty(exports, "Header", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _layout.Header;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
Object.defineProperty(exports, "Layout", {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function get() {
|
|
17
|
+
return _layout.Layout;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
6
20
|
Object.defineProperty(exports, "PuiAlertProvider", {
|
|
7
21
|
enumerable: true,
|
|
8
22
|
get: function get() {
|
|
@@ -165,6 +179,12 @@ Object.defineProperty(exports, "PuiNetworkErrorPage", {
|
|
|
165
179
|
return _PuiNetworkErrorPage.default;
|
|
166
180
|
}
|
|
167
181
|
});
|
|
182
|
+
Object.defineProperty(exports, "PuiNewUserButton", {
|
|
183
|
+
enumerable: true,
|
|
184
|
+
get: function get() {
|
|
185
|
+
return _PuiNewUserButton.default;
|
|
186
|
+
}
|
|
187
|
+
});
|
|
168
188
|
Object.defineProperty(exports, "PuiNotFoundErrorPage", {
|
|
169
189
|
enumerable: true,
|
|
170
190
|
get: function get() {
|
|
@@ -237,6 +257,12 @@ Object.defineProperty(exports, "PuiSpecificReferentielField", {
|
|
|
237
257
|
return _PuiSpecificReferentielField.default;
|
|
238
258
|
}
|
|
239
259
|
});
|
|
260
|
+
Object.defineProperty(exports, "PuiStatusChip", {
|
|
261
|
+
enumerable: true,
|
|
262
|
+
get: function get() {
|
|
263
|
+
return _PuiChip.PuiStatusChip;
|
|
264
|
+
}
|
|
265
|
+
});
|
|
240
266
|
Object.defineProperty(exports, "PuiTab", {
|
|
241
267
|
enumerable: true,
|
|
242
268
|
get: function get() {
|
|
@@ -279,6 +305,12 @@ Object.defineProperty(exports, "PuiTooltip", {
|
|
|
279
305
|
return _PuiTooltip.default;
|
|
280
306
|
}
|
|
281
307
|
});
|
|
308
|
+
Object.defineProperty(exports, "Sidebar", {
|
|
309
|
+
enumerable: true,
|
|
310
|
+
get: function get() {
|
|
311
|
+
return _layout.Sidebar;
|
|
312
|
+
}
|
|
313
|
+
});
|
|
282
314
|
Object.defineProperty(exports, "applyImprovedStyles", {
|
|
283
315
|
enumerable: true,
|
|
284
316
|
get: function get() {
|
|
@@ -359,7 +391,7 @@ var _PuiRadioItem = _interopRequireDefault(require("./components/inputs/PuiRadio
|
|
|
359
391
|
var _PuiSelect = _interopRequireDefault(require("./components/inputs/PuiSelect"));
|
|
360
392
|
var _PuiTextField = _interopRequireDefault(require("./components/inputs/PuiTextField"));
|
|
361
393
|
var _PuiBadge = _interopRequireDefault(require("./components/others/PuiBadge"));
|
|
362
|
-
var _PuiChip =
|
|
394
|
+
var _PuiChip = _interopRequireWildcard(require("./components/others/PuiChip"));
|
|
363
395
|
var _PuiDialog = _interopRequireDefault(require("./components/others/PuiDialog"));
|
|
364
396
|
var _PuiFormikForm = _interopRequireDefault(require("./components/others/PuiFormikForm"));
|
|
365
397
|
var _PuiGrid = _interopRequireDefault(require("./components/others/PuiGrid"));
|
|
@@ -395,4 +427,8 @@ var _useQuery = _interopRequireDefault(require("./hooks/useQuery"));
|
|
|
395
427
|
var _ThemeProvider = _interopRequireDefault(require("./config/ThemeProvider"));
|
|
396
428
|
var _theme = require("./config/theme");
|
|
397
429
|
var _styleUtils = require("./config/styleUtils");
|
|
430
|
+
var _layout = require("./components/ui/layout");
|
|
431
|
+
var _PuiNewUserButton = _interopRequireDefault(require("./components/buttons/PuiNewUserButton"));
|
|
432
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
433
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
398
434
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|