@esvndev/es-react-config-setting 1.0.7 → 1.0.9

package/dist/index.mjs

@@ -4293,6 +4293,21 @@ function __rest(s, e) {
     return t;
 }
 
+var SvgBecoxyNotification = function (_a) {
+    var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
+    return (React.createElement("svg", __assign({ width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", strokeWidth: props.strokeWidth || 1.5, "aria-labelledby": titleId }, props),
+        title ? React.createElement("title", { id: titleId }, title) : null,
+        React.createElement("path", { d: "M22.5 10.5a.5.5 0 0 1-.5-.5c0-2.938-1.144-5.701-3.222-7.778a.5.5 0 0 1 .707-.707A11.917 11.917 0 0 1 23 10a.5.5 0 0 1-.5.5ZM1.5 10.5A.5.5 0 0 1 1 10c0-3.206 1.248-6.22 3.515-8.485a.5.5 0 0 1 .707.707A10.925 10.925 0 0 0 2 10a.5.5 0 0 1-.5.5ZM13.5 4.18a.5.5 0 0 1-.5-.5V2c0-.551-.449-1-1-1-.551 0-1 .449-1 1v1.68a.5.5 0 0 1-1 0V2c0-1.103.897-2 2-2s2 .897 2 2v1.68a.5.5 0 0 1-.5.5ZM12 24c-1.93 0-3.5-1.57-3.5-3.5a.5.5 0 0 1 1 0c0 1.378 1.122 2.5 2.5 2.5s2.5-1.122 2.5-2.5a.5.5 0 0 1 1 0c0 1.93-1.57 3.5-3.5 3.5Z", fill: props.color || "currentColor" }),
+        React.createElement("path", { d: "M20.5 21h-17a1.502 1.502 0 0 1-.975-2.64A6.952 6.952 0 0 0 5 13.038V10c0-3.86 3.14-7 7-7s7 3.14 7 7v3.038c0 2.053.899 3.99 2.467 5.315A1.501 1.501 0 0 1 20.5 21ZM12 4c-3.309 0-6 2.691-6 6v3.038a7.944 7.944 0 0 1-2.821 6.079A.5.5 0 0 0 3.5 20h17a.5.5 0 0 0 .325-.88A7.95 7.95 0 0 1 18 13.038V10c0-3.309-2.691-6-6-6Z", fill: props.color || "currentColor" })));
+};
+
+var SvgBookOpen = function (_a) {
+    var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
+    return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "book-open_svg__feather book-open_svg__feather-book-open", "aria-labelledby": titleId }, props),
+        title ? React.createElement("title", { id: titleId }, title) : null,
+        React.createElement("path", { d: "M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2zM22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z" })));
+};
+
 var SvgCopy = function (_a) {
     var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
     return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "copy_svg__feather copy_svg__feather-copy", "aria-labelledby": titleId }, props),
@@ -4317,6 +4332,21 @@ var SvgInfo = function (_a) {
         React.createElement("path", { d: "M12 16v-4M12 8h.01" })));
 };
 
+var SvgLock = function (_a) {
+    var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
+    return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "lock_svg__feather lock_svg__feather-lock", "aria-labelledby": titleId }, props),
+        title ? React.createElement("title", { id: titleId }, title) : null,
+        React.createElement("rect", { x: 3, y: 11, width: 18, height: 11, rx: 2, ry: 2 }),
+        React.createElement("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })));
+};
+
+var SvgMessageCircle = function (_a) {
+    var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
+    return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "message-circle_svg__feather message-circle_svg__feather-message-circle", "aria-labelledby": titleId }, props),
+        title ? React.createElement("title", { id: titleId }, title) : null,
+        React.createElement("path", { d: "M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z" })));
+};
+
 var SvgPlus = function (_a) {
     var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
     return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "plus_svg__feather plus_svg__feather-plus", "aria-labelledby": titleId }, props),
@@ -4324,6 +4354,21 @@ var SvgPlus = function (_a) {
         React.createElement("path", { d: "M12 5v14M5 12h14" })));
 };
 
+var SvgSettings = function (_a) {
+    var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
+    return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "settings_svg__feather settings_svg__feather-settings", "aria-labelledby": titleId }, props),
+        title ? React.createElement("title", { id: titleId }, title) : null,
+        React.createElement("circle", { cx: 12, cy: 12, r: 3 }),
+        React.createElement("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" })));
+};
+
+var SvgThermometer = function (_a) {
+    var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
+    return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "thermometer_svg__feather thermometer_svg__feather-thermometer", "aria-labelledby": titleId }, props),
+        title ? React.createElement("title", { id: titleId }, title) : null,
+        React.createElement("path", { d: "M14 14.76V3.5a2.5 2.5 0 0 0-5 0v11.26a4.5 4.5 0 1 0 5 0z" })));
+};
+
 var SvgX = function (_a) {
     var title = _a.title, titleId = _a.titleId, props = __rest(_a, ["title", "titleId"]);
     return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: props.fontSize || 24, height: props.fontSize || 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: props.strokeWidth || 1.5, strokeLinecap: "round", strokeLinejoin: "round", className: "x_svg__feather x_svg__feather-x", "aria-labelledby": titleId }, props),
@@ -6183,28 +6228,35 @@ const SettingApp = (props) => {
     };
     const [dataSetting, setDataSetting] = useState([{
             id: 1,
-            name: 'Cài đặt chung'
+            name: t('Cài đặt chung'),
+            active: true,
+            icon: jsx(SvgSettings, { className: "setting-menu__icon" })
         }, {
             id: 2,
-            name: 'Quyền riêng tư'
+            name: t('Quyền riêng tư'),
+            icon: jsx(SvgLock, { className: "setting-menu__icon" })
         }, {
             id: 3,
-            name: 'Giao diện'
+            name: t('Giao diện'),
+            icon: jsx(SvgThermometer, { className: "setting-menu__icon" })
         }, {
             id: 4,
-            name: 'Thông báo'
+            name: t('Thông báo'),
+            icon: jsx(SvgBecoxyNotification, { className: "setting-menu__icon" })
         }, {
             id: 5,
-            name: 'Tin nhắn'
+            name: t('Tin nhắn'),
+            icon: jsx(SvgMessageCircle, { className: "setting-menu__icon" })
         }, {
             id: 6,
-            name: 'Tiện ích'
+            name: t('Tiện ích'),
+            icon: jsx(SvgBookOpen, { className: "setting-menu__icon" })
         }]);
     return (jsx(Fragment, { children: isOpen ?
-            jsx(Modal$1, { isOpen: true, toggle: handleModal, className: 'modal-dialog-centered modal-lg', contentClassName: 'p-0', onOpened: handleFormOpened, onClosed: handleFormClosed, backdrop: backdrop, children: jsx(Form$1, { id: 'form-modal-globalzone', className: 'todo-modal', onSubmit: handleSubmit, children: jsxs("div", { className: "", children: [jsx(ModalHeader, { handleModal: handleModal, typeModal: "typeModal", title: 'C\u00E0i \u0111\u1EB7t' }), jsxs(Row, { className: "m-0 gy-1", children: [jsx(Col, { md: 4, xs: 12, className: "setting-menu", children: jsx(lib.Scrollbars, { autoHide: true, autoHeight: true, autoHeightMax: windowSize.innerHeight - 180, children: jsx(Row, { className: "m-0 gy-1 mb-2 me-1", children: dataSetting && dataSetting.length > 0 ?
+            jsx(Modal$1, { isOpen: true, toggle: handleModal, className: 'modal-dialog-centered modal-lg', contentClassName: 'p-0', onOpened: handleFormOpened, onClosed: handleFormClosed, backdrop: backdrop, children: jsx(Form$1, { id: 'form-modal-globalzone', className: 'todo-modal', onSubmit: handleSubmit, children: jsxs("div", { className: "", children: [jsx(ModalHeader, { handleModal: handleModal, typeModal: "typeModal", title: 'C\u00E0i \u0111\u1EB7t' }), jsxs(Row, { className: "m-0 gy-1", children: [jsx(Col, { md: 4, xs: 12, className: "setting-menu", children: jsx(lib.Scrollbars, { autoHide: true, autoHeight: true, autoHeightMax: windowSize.innerHeight - 180, children: jsx(Row, { className: "m-0 gy-1 mb-2", children: dataSetting && dataSetting.length > 0 ?
                                                     dataSetting.map((item) => {
-                                                        return (jsx(Col, { md: 12, xs: 12, className: "setting-menu__wrapper-content", children: jsx("label", { children: item.name }) }, item.id));
-                                                    }) : null }) }) }), jsx(Col, { md: 8, xs: 12, className: "stack-navigation stack-page", children: jsx(lib.Scrollbars, { autoHide: true, autoHeight: true, autoHeightMax: windowSize.innerHeight - 180, children: jsx(ModalBody, { children: jsx("div", { children: jsxs("div", { className: 'box form-box__border mb-2', children: [jsx("h5", { className: "m-0 form-box__border--title", children: t('General information') }), jsx(Row, { className: "m-0 gy-1 mb-2 me-1" })] }) }) }) }) })] })] }) }) })
+                                                        return (jsx("div", { className: 'setting-menu__item ' + (item.active ? 'selected' : ''), children: jsxs("div", { className: "setting-menu__wrapper-content truncate", children: [item.icon, jsx("p", { className: "setting-menu__name truncate", children: jsx("span", { children: item.name }) })] }) }, item.id));
+                                                    }) : null }) }) }), jsx(Col, { md: 8, xs: 12, className: "stack-navigation stack-page", children: jsx(lib.Scrollbars, { autoHide: true, autoHeight: true, autoHeightMax: windowSize.innerHeight - 180, children: jsx(ModalBody, { children: jsx("div", { className: "setting-section" }) }) }) })] })] }) }) })
             : null }));
 };