@abpjs/theme-basic 0.7.6 → 0.9.0

package/dist/components/change-password/index.d.ts

@@ -1 +1,6 @@
-export * from './ChangePassword';
+/**
+ * @deprecated Since v0.9.0, ChangePassword has moved to @abpjs/theme-shared.
+ * Import from '@abpjs/theme-shared' instead.
+ * This re-export is provided for backward compatibility.
+ */
+export { ChangePassword, type ChangePasswordProps } from '@abpjs/theme-shared';

package/dist/components/profile/index.d.ts

@@ -1 +1,6 @@
-export * from './Profile';
+/**
+ * @deprecated Since v0.9.0, Profile has moved to @abpjs/theme-shared.
+ * Import from '@abpjs/theme-shared' instead.
+ * This re-export is provided for backward compatibility.
+ */
+export { Profile, type ProfileProps } from '@abpjs/theme-shared';

package/dist/index.d.ts

@@ -2,9 +2,12 @@
  * @abpjs/theme-basic
  *
  * ABP Framework Theme Basic components for React.
- * Translated from @abp/ng.theme.basic v0.7.6
+ * Translated from @abp/ng.theme.basic v0.9.0
  *
  * This package provides the basic theme layout components for ABP React applications.
+ *
+ * Note: In v0.9.0, ChangePassword and Profile components moved to @abpjs/theme-shared.
+ * They are re-exported from this package for backward compatibility but are deprecated.
  */
 export * from './models';
 export { LayoutProvider, useLayoutContext, useLayoutService, useNavigationElements, BrandingProvider, useBranding, useLogo, } from './contexts';

package/dist/index.js

@@ -22,7 +22,7 @@ var index_exports = {};
 __export(index_exports, {
   Block: () => Block,
   BrandingProvider: () => BrandingProvider,
-  ChangePassword: () => ChangePassword,
+  ChangePassword: () => import_theme_shared.ChangePassword,
   DefaultLogo: () => DefaultLogo,
   LAYOUTS: () => LAYOUTS,
   LanguageSelector: () => LanguageSelector,
@@ -36,7 +36,7 @@ __export(index_exports, {
   LogoText: () => LogoText,
   NavLinks: () => NavLinks,
   Navbar: () => Navbar,
-  Profile: () => Profile,
+  Profile: () => import_theme_shared2.Profile,
   SIDEBAR_Z_INDEX: () => SIDEBAR_Z_INDEX,
   SearchField: () => SearchField,
   SearchProvider: () => SearchProvider,
@@ -258,10 +258,10 @@ function LayoutBase({
 }
 
 // src/components/layout-application/LayoutApplication.tsx
-var import_react20 = require("react");
-var import_react21 = require("@chakra-ui/react");
+var import_react16 = require("react");
+var import_react17 = require("@chakra-ui/react");
 var import_react_router_dom6 = require("react-router-dom");
-var import_core8 = require("@abpjs/core");
+var import_core6 = require("@abpjs/core");
 
 // src/components/blocks/sidebars/sidebar-with-collapsible/sidebar.tsx
 var import_react14 = require("@chakra-ui/react");
@@ -377,7 +377,7 @@ var SearchField = () => {
     import_react7.InputGroup,
     {
       flex: "1",
-      startElement: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react7.Icon, { size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lu.LuSearch, {}) }),
+      startElement: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lu.LuSearch, {}),
       children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
         import_react7.Input,
         {
@@ -563,7 +563,7 @@ var CollapsibleNavLink = ({ route }) => {
           /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react10.HStack, { gap: "2", children: [
             route.badge !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react10.Badge, { size: "sm", colorPalette: route.badgeColorPalette || "gray", variant: "solid", children: route.badge }),
             /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react10.Collapsible.Context, { children: (context) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-              import_react10.Icon,
+              import_react10.chakra.span,
               {
                 "aria-hidden": true,
                 transition: "transform 0.2s",
@@ -767,342 +767,14 @@ var Block = () => {
   ] });
 };
 
-// src/components/change-password/ChangePassword.tsx
-var import_react16 = require("react");
-var import_react17 = require("@chakra-ui/react");
-var import_react_hook_form = require("react-hook-form");
-var import_core6 = require("@abpjs/core");
+// src/components/change-password/index.ts
 var import_theme_shared = require("@abpjs/theme-shared");
-var import_lucide_react2 = require("lucide-react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
-function ChangePassword({
-  visible,
-  onVisibleChange
-}) {
-  const { t } = (0, import_core6.useLocalization)();
-  const { changePassword } = (0, import_core6.useProfile)();
-  const toaster = (0, import_theme_shared.useToaster)();
-  const {
-    register,
-    handleSubmit,
-    watch,
-    reset,
-    formState: { errors, isSubmitting }
-  } = (0, import_react_hook_form.useForm)({
-    defaultValues: {
-      password: "",
-      newPassword: "",
-      repeatNewPassword: ""
-    }
-  });
-  const newPassword = watch("newPassword");
-  (0, import_react16.useEffect)(() => {
-    if (visible) {
-      reset();
-    }
-  }, [visible, reset]);
-  const onSubmit = async (data) => {
-    try {
-      await changePassword({
-        currentPassword: data.password,
-        newPassword: data.newPassword
-      });
-      toaster.success(
-        t("AbpIdentity::PasswordChangedMessage") || "Password changed successfully",
-        t("AbpUi::Success") || "Success"
-      );
-      onVisibleChange(false);
-    } catch (error) {
-      toaster.error(
-        error instanceof Error ? error.message : "An error occurred",
-        t("AbpIdentity::PasswordChangeFailed") || "Failed to change password"
-      );
-    }
-  };
-  const handleClose = () => {
-    onVisibleChange(false);
-  };
-  const passwordValidation = {
-    required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-    minLength: {
-      value: 6,
-      message: t("AbpIdentity::PasswordTooShort") || "Password must be at least 6 characters"
-    },
-    validate: {
-      hasLowercase: (value) => /[a-z]/.test(value) || t("AbpIdentity::PasswordRequiresLower") || "Password must contain a lowercase letter",
-      hasUppercase: (value) => /[A-Z]/.test(value) || t("AbpIdentity::PasswordRequiresUpper") || "Password must contain an uppercase letter",
-      hasNumber: (value) => /[0-9]/.test(value) || t("AbpIdentity::PasswordRequiresDigit") || "Password must contain a number",
-      hasSpecial: (value) => /[!@#$%^&*(),.?":{}|<>]/.test(value) || t("AbpIdentity::PasswordRequiresNonAlphanumeric") || "Password must contain a special character"
-    }
-  };
-  const modalFooter = /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react17.Button, { variant: "ghost", mr: 3, onClick: handleClose, children: t("AbpIdentity::Cancel") || "Cancel" }),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
-      import_react17.Button,
-      {
-        colorPalette: "blue",
-        type: "submit",
-        loading: isSubmitting,
-        form: "change-password-form",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react2.Check, { size: 16 }),
-          t("AbpIdentity::Save") || "Save"
-        ]
-      }
-    )
-  ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-    import_theme_shared.Modal,
-    {
-      visible,
-      onVisibleChange,
-      header: t("AbpIdentity::ChangePassword") || "Change Password",
-      footer: modalFooter,
-      centered: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("form", { id: "change-password-form", onSubmit: handleSubmit(onSubmit), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.VStack, { gap: 4, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.Field.Root, { invalid: !!errors.password, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.Field.Label, { children: [
-            t("AbpIdentity::DisplayName:CurrentPassword") || "Current Password",
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react17.Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-            import_react17.Input,
-            {
-              type: "password",
-              ...register("password", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required"
-              })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react17.Field.ErrorText, { children: errors.password?.message })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.Field.Root, { invalid: !!errors.newPassword, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.Field.Label, { children: [
-            t("AbpIdentity::DisplayName:NewPassword") || "New Password",
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react17.Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-            import_react17.Input,
-            {
-              type: "password",
-              ...register("newPassword", passwordValidation)
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react17.Field.ErrorText, { children: errors.newPassword?.message })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.Field.Root, { invalid: !!errors.repeatNewPassword, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.Field.Label, { children: [
-            t("AbpIdentity::DisplayName:NewPasswordConfirm") || "Confirm New Password",
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react17.Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-            import_react17.Input,
-            {
-              type: "password",
-              ...register("repeatNewPassword", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-                validate: (value) => value === newPassword || t("AbpIdentity::Identity.PasswordConfirmationFailed") || "Passwords do not match"
-              })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react17.Field.ErrorText, { children: errors.repeatNewPassword?.message })
-        ] })
-      ] }) })
-    }
-  );
-}
 
-// src/components/profile/Profile.tsx
-var import_react18 = require("react");
-var import_react19 = require("@chakra-ui/react");
-var import_react_hook_form2 = require("react-hook-form");
-var import_core7 = require("@abpjs/core");
+// src/components/profile/index.ts
 var import_theme_shared2 = require("@abpjs/theme-shared");
-var import_lucide_react3 = require("lucide-react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-function Profile({
-  visible,
-  onVisibleChange
-}) {
-  const { t } = (0, import_core7.useLocalization)();
-  const { profile, fetchProfile, updateProfile, loading } = (0, import_core7.useProfile)();
-  const toaster = (0, import_theme_shared2.useToaster)();
-  const {
-    register,
-    handleSubmit,
-    reset,
-    formState: { errors, isSubmitting }
-  } = (0, import_react_hook_form2.useForm)({
-    defaultValues: {
-      userName: "",
-      email: "",
-      name: "",
-      surname: "",
-      phoneNumber: ""
-    }
-  });
-  (0, import_react18.useEffect)(() => {
-    if (visible) {
-      fetchProfile().then(() => {
-      });
-    }
-  }, [visible, fetchProfile]);
-  (0, import_react18.useEffect)(() => {
-    if (profile) {
-      reset({
-        userName: profile.userName || "",
-        email: profile.email || "",
-        name: profile.name || "",
-        surname: profile.surname || "",
-        phoneNumber: profile.phoneNumber || ""
-      });
-    }
-  }, [profile, reset]);
-  const onSubmit = async (data) => {
-    try {
-      await updateProfile(data);
-      toaster.success(
-        t("AbpIdentity::ProfileUpdatedMessage") || "Profile updated successfully",
-        t("AbpUi::Success") || "Success"
-      );
-      onVisibleChange(false);
-    } catch (error) {
-      toaster.error(
-        error instanceof Error ? error.message : "An error occurred",
-        t("AbpIdentity::ProfileUpdateFailed") || "Failed to update profile"
-      );
-    }
-  };
-  const handleClose = () => {
-    onVisibleChange(false);
-  };
-  const modalFooter = /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Button, { variant: "ghost", mr: 3, onClick: handleClose, children: t("AbpIdentity::Cancel") || "Cancel" }),
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
-      import_react19.Button,
-      {
-        colorPalette: "blue",
-        type: "submit",
-        loading: isSubmitting || loading,
-        form: "profile-form",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react3.Check, { size: 16 }),
-          t("AbpIdentity::Save") || "Save"
-        ]
-      }
-    )
-  ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-    import_theme_shared2.Modal,
-    {
-      visible,
-      onVisibleChange,
-      header: t("AbpIdentity::PersonalInfo") || "Personal Info",
-      footer: modalFooter,
-      size: "lg",
-      centered: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("form", { id: "profile-form", onSubmit: handleSubmit(onSubmit), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.VStack, { gap: 4, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.Field.Root, { invalid: !!errors.userName, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.Field.Label, { children: [
-            t("AbpIdentity::DisplayName:UserName") || "Username",
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-            import_react19.Input,
-            {
-              type: "text",
-              ...register("userName", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-                maxLength: {
-                  value: 256,
-                  message: "Maximum 256 characters"
-                }
-              })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.ErrorText, { children: errors.userName?.message })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.HStack, { gap: 4, w: "full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.Field.Root, { invalid: !!errors.name, flex: 1, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.Label, { children: t("AbpIdentity::DisplayName:Name") || "Name" }),
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-              import_react19.Input,
-              {
-                type: "text",
-                ...register("name", {
-                  maxLength: {
-                    value: 64,
-                    message: "Maximum 64 characters"
-                  }
-                })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.ErrorText, { children: errors.name?.message })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.Field.Root, { invalid: !!errors.surname, flex: 1, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.Label, { children: t("AbpIdentity::DisplayName:Surname") || "Surname" }),
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-              import_react19.Input,
-              {
-                type: "text",
-                ...register("surname", {
-                  maxLength: {
-                    value: 64,
-                    message: "Maximum 64 characters"
-                  }
-                })
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.ErrorText, { children: errors.surname?.message })
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.Field.Root, { invalid: !!errors.email, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.Field.Label, { children: [
-            t("AbpIdentity::DisplayName:EmailAddress") || "Email Address",
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-            import_react19.Input,
-            {
-              type: "email",
-              ...register("email", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-                pattern: {
-                  value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i,
-                  message: t("AbpIdentity::InvalidEmail") || "Invalid email address"
-                },
-                maxLength: {
-                  value: 256,
-                  message: "Maximum 256 characters"
-                }
-              })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.ErrorText, { children: errors.email?.message })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react19.Field.Root, { invalid: !!errors.phoneNumber, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.Label, { children: t("AbpIdentity::DisplayName:PhoneNumber") || "Phone Number" }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-            import_react19.Input,
-            {
-              type: "tel",
-              ...register("phoneNumber", {
-                maxLength: {
-                  value: 16,
-                  message: "Maximum 16 characters"
-                }
-              })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react19.Field.ErrorText, { children: errors.phoneNumber?.message })
-        ] })
-      ] }) })
-    }
-  );
-}
 
 // src/components/layout-application/LayoutApplication.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var SIDEBAR_Z_INDEX = 1100;
 function LayoutApplication({
   showLanguageSelector = true,
@@ -1118,18 +790,18 @@ function LayoutApplication({
   children
 }) {
   const navigate = (0, import_react_router_dom6.useNavigate)();
-  const { logout } = (0, import_core8.useAuth)();
-  const { direction, isRtl } = (0, import_core8.useDirection)();
-  const [isChangePasswordOpen, setIsChangePasswordOpen] = (0, import_react20.useState)(false);
-  const [isProfileOpen, setIsProfileOpen] = (0, import_react20.useState)(false);
-  const handleLogout = (0, import_react20.useCallback)(() => {
+  const { logout } = (0, import_core6.useAuth)();
+  const { direction, isRtl } = (0, import_core6.useDirection)();
+  const [isChangePasswordOpen, setIsChangePasswordOpen] = (0, import_react16.useState)(false);
+  const [isProfileOpen, setIsProfileOpen] = (0, import_react16.useState)(false);
+  const handleLogout = (0, import_react16.useCallback)(() => {
     logout();
     navigate("/account/login");
   }, [logout, navigate]);
-  const handleChangePassword = (0, import_react20.useCallback)(() => {
+  const handleChangePassword = (0, import_react16.useCallback)(() => {
     setIsChangePasswordOpen(true);
   }, []);
-  const handleProfile = (0, import_react20.useCallback)(() => {
+  const handleProfile = (0, import_react16.useCallback)(() => {
     setIsProfileOpen(true);
   }, []);
   const sidebarProps = {
@@ -1148,10 +820,10 @@ function LayoutApplication({
       onLogout: handleLogout
     } : void 0
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react21.Flex, { minH: "100vh", dir: direction, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-        import_react21.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react17.Flex, { minH: "100vh", dir: direction, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        import_react17.Box,
         {
           position: "fixed",
           top: 0,
@@ -1160,11 +832,11 @@ function LayoutApplication({
           insetInline: 0,
           zIndex: SIDEBAR_Z_INDEX,
           hideFrom: "md",
-          children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Navbar, { sidebarProps })
+          children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Navbar, { sidebarProps })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-        import_react21.Box,
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        import_react17.Box,
         {
           as: "aside",
           position: "fixed",
@@ -1174,11 +846,11 @@ function LayoutApplication({
           bottom: 0,
           hideBelow: "md",
           zIndex: SIDEBAR_Z_INDEX,
-          children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Sidebar, { h: "100vh", ...sidebarProps })
+          children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Sidebar, { h: "100vh", ...sidebarProps })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-        import_react21.Box,
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        import_react17.Box,
         {
           as: "main",
           flex: "1",
@@ -1187,27 +859,27 @@ function LayoutApplication({
           mt: { base: "60px", md: 0 },
           p: { base: 4, md: 6 },
           minH: "100vh",
-          children: children || /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_router_dom6.Outlet, {})
+          children: children || /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_router_dom6.Outlet, {})
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-      ChangePassword,
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      import_theme_shared.ChangePassword,
       {
         visible: isChangePasswordOpen,
         onVisibleChange: setIsChangePasswordOpen
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Profile, { visible: isProfileOpen, onVisibleChange: setIsProfileOpen })
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_theme_shared2.Profile, { visible: isProfileOpen, onVisibleChange: setIsProfileOpen })
   ] });
 }
-LayoutApplication.type = import_core8.eLayoutType.application;
+LayoutApplication.type = import_core6.eLayoutType.application;
 
 // src/components/layout-account/LayoutAccount.tsx
-var import_react22 = require("@chakra-ui/react");
+var import_react18 = require("@chakra-ui/react");
 var import_react_router_dom7 = require("react-router-dom");
-var import_core9 = require("@abpjs/core");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_core7 = require("@abpjs/core");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function LayoutAccount({
   showLanguageSelector = true,
   showSearch = false,
@@ -1220,7 +892,7 @@ function LayoutAccount({
   footerContent,
   children
 }) {
-  const { direction, isRtl } = (0, import_core9.useDirection)();
+  const { direction, isRtl } = (0, import_core7.useDirection)();
   const sidebarProps = {
     showSearch,
     showLanguageSelector,
@@ -1234,9 +906,9 @@ function LayoutAccount({
     userProfileProps: void 0
     // No user profile on account pages
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_react22.Flex, { minH: "100vh", dir: direction, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      import_react22.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react18.Flex, { minH: "100vh", dir: direction, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      import_react18.Box,
       {
         position: "fixed",
         top: 0,
@@ -1245,11 +917,11 @@ function LayoutAccount({
         insetInline: 0,
         zIndex: SIDEBAR_Z_INDEX,
         hideFrom: "md",
-        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Navbar, { sidebarProps })
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Navbar, { sidebarProps })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      import_react22.Box,
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      import_react18.Box,
       {
         as: "aside",
         position: "fixed",
@@ -1259,11 +931,11 @@ function LayoutAccount({
         bottom: 0,
         hideBelow: "md",
         zIndex: SIDEBAR_Z_INDEX,
-        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Sidebar, { h: "100vh", ...sidebarProps })
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Sidebar, { h: "100vh", ...sidebarProps })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      import_react22.Box,
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      import_react18.Box,
       {
         as: "main",
         flex: "1",
@@ -1272,36 +944,36 @@ function LayoutAccount({
         mt: { base: "60px", md: 0 },
         p: { base: 4, md: 6 },
         minH: "100vh",
-        children: children || /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_router_dom7.Outlet, {})
+        children: children || /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_router_dom7.Outlet, {})
       }
     )
   ] });
 }
-LayoutAccount.type = import_core9.eLayoutType.account;
+LayoutAccount.type = import_core7.eLayoutType.account;
 
 // src/components/layout-empty/LayoutEmpty.tsx
-var import_react23 = require("@chakra-ui/react");
+var import_react19 = require("@chakra-ui/react");
 var import_react_router_dom8 = require("react-router-dom");
-var import_core10 = require("@abpjs/core");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_core8 = require("@abpjs/core");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function LayoutEmpty({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react23.Box, { minH: "100vh", children: children || /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_router_dom8.Outlet, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react19.Box, { minH: "100vh", children: children || /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_router_dom8.Outlet, {}) });
 }
-LayoutEmpty.type = import_core10.eLayoutType.empty;
+LayoutEmpty.type = import_core8.eLayoutType.empty;
 
 // src/providers/ThemeBasicProvider.tsx
-var import_react24 = require("react");
+var import_react20 = require("react");
 var import_theme_shared3 = require("@abpjs/theme-shared");
-var import_core11 = require("@abpjs/core");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_core9 = require("@abpjs/core");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function LocaleSync({ children }) {
-  const { language } = (0, import_core11.useSession)();
-  const { direction } = (0, import_core11.useDirection)();
-  (0, import_react24.useEffect)(() => {
+  const { language } = (0, import_core9.useSession)();
+  const { direction } = (0, import_core9.useDirection)();
+  (0, import_react20.useEffect)(() => {
     document.documentElement.dir = direction;
     document.documentElement.lang = language || "en";
   }, [direction, language]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children });
 }
 function ThemeBasicInner({
   children,
@@ -1316,9 +988,9 @@ function ThemeBasicInner({
   appName,
   logoLink
 }) {
-  const { language } = (0, import_core11.useSession)();
+  const { language } = (0, import_core9.useSession)();
   const locale = language || "en-US";
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     import_theme_shared3.ThemeSharedProvider,
     {
       renderToasts,
@@ -1328,14 +1000,14 @@ function ThemeBasicInner({
       enableColorMode,
       defaultColorMode,
       locale,
-      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LocaleSync, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(LocaleSync, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         BrandingProvider,
         {
           logo,
           logoIcon,
           appName,
           logoLink,
-          children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LayoutProvider, { children })
+          children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(LayoutProvider, { children })
         }
       ) })
     }
@@ -1409,7 +1081,7 @@ function ThemeBasicProvider({
   logoLink
 }) {
   const mergedThemeOverrides = themeOverrides || defaultThemeBasicConfig;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     ThemeBasicInner,
     {
       renderToasts,

package/dist/index.mjs

@@ -296,7 +296,7 @@ var LogoIcon = (props) => /* @__PURE__ */ jsxs2("svg", { height: "24", viewBox:
 ] });
 
 // src/components/blocks/sidebars/sidebar-with-collapsible/search-field.tsx
-import { Icon, Input, InputGroup } from "@chakra-ui/react";
+import { Input, InputGroup } from "@chakra-ui/react";
 import { LuSearch } from "react-icons/lu";
 import { useLocalization } from "@abpjs/core";
 
@@ -336,7 +336,7 @@ var SearchField = () => {
     InputGroup,
     {
       flex: "1",
-      startElement: /* @__PURE__ */ jsx6(Icon, { size: "sm", children: /* @__PURE__ */ jsx6(LuSearch, {}) }),
+      startElement: /* @__PURE__ */ jsx6(LuSearch, {}),
       children: /* @__PURE__ */ jsx6(
         Input,
         {
@@ -441,7 +441,7 @@ var UserProfile = ({ onChangePassword, onProfile, onLogout, loginUrl = "/account
 };
 
 // src/components/blocks/sidebars/sidebar-with-collapsible/nav-links.tsx
-import { Badge as Badge2, Button as Button3, Collapsible as Collapsible2, HStack as HStack3, Icon as Icon2, Stack } from "@chakra-ui/react";
+import { Badge as Badge2, Button as Button3, Collapsible as Collapsible2, HStack as HStack3, Stack, chakra } from "@chakra-ui/react";
 import { LuChevronDown } from "react-icons/lu";
 import { useConfig as useConfig2, useDirection as useDirection2 } from "@abpjs/core";
 import { useMemo as useMemo4, useState as useState4 } from "react";
@@ -522,7 +522,7 @@ var CollapsibleNavLink = ({ route }) => {
           /* @__PURE__ */ jsxs5(HStack3, { gap: "2", children: [
             route.badge !== void 0 && /* @__PURE__ */ jsx9(Badge2, { size: "sm", colorPalette: route.badgeColorPalette || "gray", variant: "solid", children: route.badge }),
             /* @__PURE__ */ jsx9(Collapsible2.Context, { children: (context) => /* @__PURE__ */ jsx9(
-              Icon2,
+              chakra.span,
               {
                 "aria-hidden": true,
                 transition: "transform 0.2s",
@@ -726,353 +726,14 @@ var Block = () => {
   ] });
 };
 
-// src/components/change-password/ChangePassword.tsx
-import { useEffect } from "react";
-import {
-  Button as Button5,
-  VStack,
-  Input as Input2,
-  Field
-} from "@chakra-ui/react";
-import { useForm } from "react-hook-form";
-import { useLocalization as useLocalization3, useProfile } from "@abpjs/core";
-import { Modal, useToaster } from "@abpjs/theme-shared";
-import { Check } from "lucide-react";
-import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
-function ChangePassword({
-  visible,
-  onVisibleChange
-}) {
-  const { t } = useLocalization3();
-  const { changePassword } = useProfile();
-  const toaster = useToaster();
-  const {
-    register,
-    handleSubmit,
-    watch,
-    reset,
-    formState: { errors, isSubmitting }
-  } = useForm({
-    defaultValues: {
-      password: "",
-      newPassword: "",
-      repeatNewPassword: ""
-    }
-  });
-  const newPassword = watch("newPassword");
-  useEffect(() => {
-    if (visible) {
-      reset();
-    }
-  }, [visible, reset]);
-  const onSubmit = async (data) => {
-    try {
-      await changePassword({
-        currentPassword: data.password,
-        newPassword: data.newPassword
-      });
-      toaster.success(
-        t("AbpIdentity::PasswordChangedMessage") || "Password changed successfully",
-        t("AbpUi::Success") || "Success"
-      );
-      onVisibleChange(false);
-    } catch (error) {
-      toaster.error(
-        error instanceof Error ? error.message : "An error occurred",
-        t("AbpIdentity::PasswordChangeFailed") || "Failed to change password"
-      );
-    }
-  };
-  const handleClose = () => {
-    onVisibleChange(false);
-  };
-  const passwordValidation = {
-    required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-    minLength: {
-      value: 6,
-      message: t("AbpIdentity::PasswordTooShort") || "Password must be at least 6 characters"
-    },
-    validate: {
-      hasLowercase: (value) => /[a-z]/.test(value) || t("AbpIdentity::PasswordRequiresLower") || "Password must contain a lowercase letter",
-      hasUppercase: (value) => /[A-Z]/.test(value) || t("AbpIdentity::PasswordRequiresUpper") || "Password must contain an uppercase letter",
-      hasNumber: (value) => /[0-9]/.test(value) || t("AbpIdentity::PasswordRequiresDigit") || "Password must contain a number",
-      hasSpecial: (value) => /[!@#$%^&*(),.?":{}|<>]/.test(value) || t("AbpIdentity::PasswordRequiresNonAlphanumeric") || "Password must contain a special character"
-    }
-  };
-  const modalFooter = /* @__PURE__ */ jsxs10(Fragment3, { children: [
-    /* @__PURE__ */ jsx14(Button5, { variant: "ghost", mr: 3, onClick: handleClose, children: t("AbpIdentity::Cancel") || "Cancel" }),
-    /* @__PURE__ */ jsxs10(
-      Button5,
-      {
-        colorPalette: "blue",
-        type: "submit",
-        loading: isSubmitting,
-        form: "change-password-form",
-        children: [
-          /* @__PURE__ */ jsx14(Check, { size: 16 }),
-          t("AbpIdentity::Save") || "Save"
-        ]
-      }
-    )
-  ] });
-  return /* @__PURE__ */ jsx14(
-    Modal,
-    {
-      visible,
-      onVisibleChange,
-      header: t("AbpIdentity::ChangePassword") || "Change Password",
-      footer: modalFooter,
-      centered: true,
-      children: /* @__PURE__ */ jsx14("form", { id: "change-password-form", onSubmit: handleSubmit(onSubmit), children: /* @__PURE__ */ jsxs10(VStack, { gap: 4, children: [
-        /* @__PURE__ */ jsxs10(Field.Root, { invalid: !!errors.password, children: [
-          /* @__PURE__ */ jsxs10(Field.Label, { children: [
-            t("AbpIdentity::DisplayName:CurrentPassword") || "Current Password",
-            /* @__PURE__ */ jsx14(Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ jsx14(
-            Input2,
-            {
-              type: "password",
-              ...register("password", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required"
-              })
-            }
-          ),
-          /* @__PURE__ */ jsx14(Field.ErrorText, { children: errors.password?.message })
-        ] }),
-        /* @__PURE__ */ jsxs10(Field.Root, { invalid: !!errors.newPassword, children: [
-          /* @__PURE__ */ jsxs10(Field.Label, { children: [
-            t("AbpIdentity::DisplayName:NewPassword") || "New Password",
-            /* @__PURE__ */ jsx14(Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ jsx14(
-            Input2,
-            {
-              type: "password",
-              ...register("newPassword", passwordValidation)
-            }
-          ),
-          /* @__PURE__ */ jsx14(Field.ErrorText, { children: errors.newPassword?.message })
-        ] }),
-        /* @__PURE__ */ jsxs10(Field.Root, { invalid: !!errors.repeatNewPassword, children: [
-          /* @__PURE__ */ jsxs10(Field.Label, { children: [
-            t("AbpIdentity::DisplayName:NewPasswordConfirm") || "Confirm New Password",
-            /* @__PURE__ */ jsx14(Field.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ jsx14(
-            Input2,
-            {
-              type: "password",
-              ...register("repeatNewPassword", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-                validate: (value) => value === newPassword || t("AbpIdentity::Identity.PasswordConfirmationFailed") || "Passwords do not match"
-              })
-            }
-          ),
-          /* @__PURE__ */ jsx14(Field.ErrorText, { children: errors.repeatNewPassword?.message })
-        ] })
-      ] }) })
-    }
-  );
-}
+// src/components/change-password/index.ts
+import { ChangePassword } from "@abpjs/theme-shared";
 
-// src/components/profile/Profile.tsx
-import { useEffect as useEffect2 } from "react";
-import {
-  Button as Button6,
-  VStack as VStack2,
-  HStack as HStack6,
-  Input as Input3,
-  Field as Field2
-} from "@chakra-ui/react";
-import { useForm as useForm2 } from "react-hook-form";
-import { useLocalization as useLocalization4, useProfile as useProfile2 } from "@abpjs/core";
-import { Modal as Modal2, useToaster as useToaster2 } from "@abpjs/theme-shared";
-import { Check as Check2 } from "lucide-react";
-import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
-function Profile({
-  visible,
-  onVisibleChange
-}) {
-  const { t } = useLocalization4();
-  const { profile, fetchProfile, updateProfile, loading } = useProfile2();
-  const toaster = useToaster2();
-  const {
-    register,
-    handleSubmit,
-    reset,
-    formState: { errors, isSubmitting }
-  } = useForm2({
-    defaultValues: {
-      userName: "",
-      email: "",
-      name: "",
-      surname: "",
-      phoneNumber: ""
-    }
-  });
-  useEffect2(() => {
-    if (visible) {
-      fetchProfile().then(() => {
-      });
-    }
-  }, [visible, fetchProfile]);
-  useEffect2(() => {
-    if (profile) {
-      reset({
-        userName: profile.userName || "",
-        email: profile.email || "",
-        name: profile.name || "",
-        surname: profile.surname || "",
-        phoneNumber: profile.phoneNumber || ""
-      });
-    }
-  }, [profile, reset]);
-  const onSubmit = async (data) => {
-    try {
-      await updateProfile(data);
-      toaster.success(
-        t("AbpIdentity::ProfileUpdatedMessage") || "Profile updated successfully",
-        t("AbpUi::Success") || "Success"
-      );
-      onVisibleChange(false);
-    } catch (error) {
-      toaster.error(
-        error instanceof Error ? error.message : "An error occurred",
-        t("AbpIdentity::ProfileUpdateFailed") || "Failed to update profile"
-      );
-    }
-  };
-  const handleClose = () => {
-    onVisibleChange(false);
-  };
-  const modalFooter = /* @__PURE__ */ jsxs11(Fragment4, { children: [
-    /* @__PURE__ */ jsx15(Button6, { variant: "ghost", mr: 3, onClick: handleClose, children: t("AbpIdentity::Cancel") || "Cancel" }),
-    /* @__PURE__ */ jsxs11(
-      Button6,
-      {
-        colorPalette: "blue",
-        type: "submit",
-        loading: isSubmitting || loading,
-        form: "profile-form",
-        children: [
-          /* @__PURE__ */ jsx15(Check2, { size: 16 }),
-          t("AbpIdentity::Save") || "Save"
-        ]
-      }
-    )
-  ] });
-  return /* @__PURE__ */ jsx15(
-    Modal2,
-    {
-      visible,
-      onVisibleChange,
-      header: t("AbpIdentity::PersonalInfo") || "Personal Info",
-      footer: modalFooter,
-      size: "lg",
-      centered: true,
-      children: /* @__PURE__ */ jsx15("form", { id: "profile-form", onSubmit: handleSubmit(onSubmit), children: /* @__PURE__ */ jsxs11(VStack2, { gap: 4, children: [
-        /* @__PURE__ */ jsxs11(Field2.Root, { invalid: !!errors.userName, children: [
-          /* @__PURE__ */ jsxs11(Field2.Label, { children: [
-            t("AbpIdentity::DisplayName:UserName") || "Username",
-            /* @__PURE__ */ jsx15(Field2.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ jsx15(
-            Input3,
-            {
-              type: "text",
-              ...register("userName", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-                maxLength: {
-                  value: 256,
-                  message: "Maximum 256 characters"
-                }
-              })
-            }
-          ),
-          /* @__PURE__ */ jsx15(Field2.ErrorText, { children: errors.userName?.message })
-        ] }),
-        /* @__PURE__ */ jsxs11(HStack6, { gap: 4, w: "full", children: [
-          /* @__PURE__ */ jsxs11(Field2.Root, { invalid: !!errors.name, flex: 1, children: [
-            /* @__PURE__ */ jsx15(Field2.Label, { children: t("AbpIdentity::DisplayName:Name") || "Name" }),
-            /* @__PURE__ */ jsx15(
-              Input3,
-              {
-                type: "text",
-                ...register("name", {
-                  maxLength: {
-                    value: 64,
-                    message: "Maximum 64 characters"
-                  }
-                })
-              }
-            ),
-            /* @__PURE__ */ jsx15(Field2.ErrorText, { children: errors.name?.message })
-          ] }),
-          /* @__PURE__ */ jsxs11(Field2.Root, { invalid: !!errors.surname, flex: 1, children: [
-            /* @__PURE__ */ jsx15(Field2.Label, { children: t("AbpIdentity::DisplayName:Surname") || "Surname" }),
-            /* @__PURE__ */ jsx15(
-              Input3,
-              {
-                type: "text",
-                ...register("surname", {
-                  maxLength: {
-                    value: 64,
-                    message: "Maximum 64 characters"
-                  }
-                })
-              }
-            ),
-            /* @__PURE__ */ jsx15(Field2.ErrorText, { children: errors.surname?.message })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs11(Field2.Root, { invalid: !!errors.email, children: [
-          /* @__PURE__ */ jsxs11(Field2.Label, { children: [
-            t("AbpIdentity::DisplayName:EmailAddress") || "Email Address",
-            /* @__PURE__ */ jsx15(Field2.RequiredIndicator, {})
-          ] }),
-          /* @__PURE__ */ jsx15(
-            Input3,
-            {
-              type: "email",
-              ...register("email", {
-                required: t("AbpIdentity::ThisFieldIsRequired") || "This field is required",
-                pattern: {
-                  value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i,
-                  message: t("AbpIdentity::InvalidEmail") || "Invalid email address"
-                },
-                maxLength: {
-                  value: 256,
-                  message: "Maximum 256 characters"
-                }
-              })
-            }
-          ),
-          /* @__PURE__ */ jsx15(Field2.ErrorText, { children: errors.email?.message })
-        ] }),
-        /* @__PURE__ */ jsxs11(Field2.Root, { invalid: !!errors.phoneNumber, children: [
-          /* @__PURE__ */ jsx15(Field2.Label, { children: t("AbpIdentity::DisplayName:PhoneNumber") || "Phone Number" }),
-          /* @__PURE__ */ jsx15(
-            Input3,
-            {
-              type: "tel",
-              ...register("phoneNumber", {
-                maxLength: {
-                  value: 16,
-                  message: "Maximum 16 characters"
-                }
-              })
-            }
-          ),
-          /* @__PURE__ */ jsx15(Field2.ErrorText, { children: errors.phoneNumber?.message })
-        ] })
-      ] }) })
-    }
-  );
-}
+// src/components/profile/index.ts
+import { Profile } from "@abpjs/theme-shared";
 
 // src/components/layout-application/LayoutApplication.tsx
-import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
 var SIDEBAR_Z_INDEX = 1100;
 function LayoutApplication({
   showLanguageSelector = true,
@@ -1118,9 +779,9 @@ function LayoutApplication({
       onLogout: handleLogout
     } : void 0
   };
-  return /* @__PURE__ */ jsxs12(Fragment5, { children: [
-    /* @__PURE__ */ jsxs12(Flex2, { minH: "100vh", dir: direction, children: [
-      /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs10(Fragment3, { children: [
+    /* @__PURE__ */ jsxs10(Flex2, { minH: "100vh", dir: direction, children: [
+      /* @__PURE__ */ jsx14(
         Box5,
         {
           position: "fixed",
@@ -1130,10 +791,10 @@ function LayoutApplication({
           insetInline: 0,
           zIndex: SIDEBAR_Z_INDEX,
           hideFrom: "md",
-          children: /* @__PURE__ */ jsx16(Navbar, { sidebarProps })
+          children: /* @__PURE__ */ jsx14(Navbar, { sidebarProps })
         }
       ),
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx14(
         Box5,
         {
           as: "aside",
@@ -1144,10 +805,10 @@ function LayoutApplication({
           bottom: 0,
           hideBelow: "md",
           zIndex: SIDEBAR_Z_INDEX,
-          children: /* @__PURE__ */ jsx16(Sidebar, { h: "100vh", ...sidebarProps })
+          children: /* @__PURE__ */ jsx14(Sidebar, { h: "100vh", ...sidebarProps })
         }
       ),
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx14(
         Box5,
         {
           as: "main",
@@ -1157,18 +818,18 @@ function LayoutApplication({
           mt: { base: "60px", md: 0 },
           p: { base: 4, md: 6 },
           minH: "100vh",
-          children: children || /* @__PURE__ */ jsx16(Outlet2, {})
+          children: children || /* @__PURE__ */ jsx14(Outlet2, {})
         }
       )
     ] }),
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx14(
       ChangePassword,
       {
         visible: isChangePasswordOpen,
         onVisibleChange: setIsChangePasswordOpen
       }
     ),
-    /* @__PURE__ */ jsx16(Profile, { visible: isProfileOpen, onVisibleChange: setIsProfileOpen })
+    /* @__PURE__ */ jsx14(Profile, { visible: isProfileOpen, onVisibleChange: setIsProfileOpen })
   ] });
 }
 LayoutApplication.type = eLayoutType.application;
@@ -1177,7 +838,7 @@ LayoutApplication.type = eLayoutType.application;
 import { Box as Box6, Flex as Flex3 } from "@chakra-ui/react";
 import { Outlet as Outlet3 } from "react-router-dom";
 import { eLayoutType as eLayoutType2, useDirection as useDirection5 } from "@abpjs/core";
-import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
 function LayoutAccount({
   showLanguageSelector = true,
   showSearch = false,
@@ -1204,8 +865,8 @@ function LayoutAccount({
     userProfileProps: void 0
     // No user profile on account pages
   };
-  return /* @__PURE__ */ jsxs13(Flex3, { minH: "100vh", dir: direction, children: [
-    /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsxs11(Flex3, { minH: "100vh", dir: direction, children: [
+    /* @__PURE__ */ jsx15(
       Box6,
       {
         position: "fixed",
@@ -1215,10 +876,10 @@ function LayoutAccount({
         insetInline: 0,
         zIndex: SIDEBAR_Z_INDEX,
         hideFrom: "md",
-        children: /* @__PURE__ */ jsx17(Navbar, { sidebarProps })
+        children: /* @__PURE__ */ jsx15(Navbar, { sidebarProps })
       }
     ),
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx15(
       Box6,
       {
         as: "aside",
@@ -1229,10 +890,10 @@ function LayoutAccount({
         bottom: 0,
         hideBelow: "md",
         zIndex: SIDEBAR_Z_INDEX,
-        children: /* @__PURE__ */ jsx17(Sidebar, { h: "100vh", ...sidebarProps })
+        children: /* @__PURE__ */ jsx15(Sidebar, { h: "100vh", ...sidebarProps })
       }
     ),
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx15(
       Box6,
       {
         as: "main",
@@ -1242,7 +903,7 @@ function LayoutAccount({
         mt: { base: "60px", md: 0 },
         p: { base: 4, md: 6 },
         minH: "100vh",
-        children: children || /* @__PURE__ */ jsx17(Outlet3, {})
+        children: children || /* @__PURE__ */ jsx15(Outlet3, {})
       }
     )
   ] });
@@ -1253,25 +914,25 @@ LayoutAccount.type = eLayoutType2.account;
 import { Box as Box7 } from "@chakra-ui/react";
 import { Outlet as Outlet4 } from "react-router-dom";
 import { eLayoutType as eLayoutType3 } from "@abpjs/core";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function LayoutEmpty({ children }) {
-  return /* @__PURE__ */ jsx18(Box7, { minH: "100vh", children: children || /* @__PURE__ */ jsx18(Outlet4, {}) });
+  return /* @__PURE__ */ jsx16(Box7, { minH: "100vh", children: children || /* @__PURE__ */ jsx16(Outlet4, {}) });
 }
 LayoutEmpty.type = eLayoutType3.empty;
 
 // src/providers/ThemeBasicProvider.tsx
-import { useEffect as useEffect3 } from "react";
+import { useEffect } from "react";
 import { ThemeSharedProvider, defineConfig } from "@abpjs/theme-shared";
 import { useSession as useSession2, useDirection as useDirection6 } from "@abpjs/core";
-import { Fragment as Fragment6, jsx as jsx19 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx17 } from "react/jsx-runtime";
 function LocaleSync({ children }) {
   const { language } = useSession2();
   const { direction } = useDirection6();
-  useEffect3(() => {
+  useEffect(() => {
     document.documentElement.dir = direction;
     document.documentElement.lang = language || "en";
   }, [direction, language]);
-  return /* @__PURE__ */ jsx19(Fragment6, { children });
+  return /* @__PURE__ */ jsx17(Fragment4, { children });
 }
 function ThemeBasicInner({
   children,
@@ -1288,7 +949,7 @@ function ThemeBasicInner({
 }) {
   const { language } = useSession2();
   const locale = language || "en-US";
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx17(
     ThemeSharedProvider,
     {
       renderToasts,
@@ -1298,14 +959,14 @@ function ThemeBasicInner({
       enableColorMode,
       defaultColorMode,
       locale,
-      children: /* @__PURE__ */ jsx19(LocaleSync, { children: /* @__PURE__ */ jsx19(
+      children: /* @__PURE__ */ jsx17(LocaleSync, { children: /* @__PURE__ */ jsx17(
         BrandingProvider,
         {
           logo,
           logoIcon,
           appName,
           logoLink,
-          children: /* @__PURE__ */ jsx19(LayoutProvider, { children })
+          children: /* @__PURE__ */ jsx17(LayoutProvider, { children })
         }
       ) })
     }
@@ -1379,7 +1040,7 @@ function ThemeBasicProvider({
   logoLink
 }) {
   const mergedThemeOverrides = themeOverrides || defaultThemeBasicConfig;
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx17(
     ThemeBasicInner,
     {
       renderToasts,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abpjs/theme-basic",
-  "version": "0.7.6",
+  "version": "0.9.0",
   "description": "ABP Framework Theme Basic components for React - translated from @abp/ng.theme.basic",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -27,11 +27,11 @@
     "lucide-react": "^0.400.0",
     "react-hook-form": "^7.48.0",
     "react-icons": "^5.0.0",
-    "@abpjs/core": "0.7.6",
-    "@abpjs/theme-shared": "0.7.6"
+    "@abpjs/core": "0.9.0",
+    "@abpjs/theme-shared": "0.9.0"
   },
   "devDependencies": {
-    "@abp/ng.theme.basic": "0.7.6"
+    "@abp/ng.theme.basic": "0.9.0"
   },
   "author": "tekthar.com",
   "license": "LGPL-3.0",

package/dist/components/change-password/ChangePassword.d.ts

@@ -1,26 +0,0 @@
-import React from 'react';
-export interface ChangePasswordProps {
-    /** Whether the modal is visible */
-    visible: boolean;
-    /** Callback when visibility changes */
-    onVisibleChange: (visible: boolean) => void;
-}
-/**
- * Change password modal component.
- * Translated from Angular ChangePasswordComponent.
- *
- * Provides a modal dialog for changing the user's password with:
- * - Current password input
- * - New password input with validation
- * - Confirm new password with match validation
- *
- * @example
- * ```tsx
- * <ChangePassword
- *   visible={isOpen}
- *   onVisibleChange={setIsOpen}
- * />
- * ```
- */
-export declare function ChangePassword({ visible, onVisibleChange, }: ChangePasswordProps): React.ReactElement;
-export default ChangePassword;

package/dist/components/profile/Profile.d.ts

@@ -1,28 +0,0 @@
-import React from 'react';
-export interface ProfileProps {
-    /** Whether the modal is visible */
-    visible: boolean;
-    /** Callback when visibility changes */
-    onVisibleChange: (visible: boolean) => void;
-}
-/**
- * Profile modal component for editing user profile.
- * Translated from Angular ProfileComponent.
- *
- * Provides a modal dialog for editing user profile with:
- * - Username (required)
- * - Email (required)
- * - Name
- * - Surname
- * - Phone number
- *
- * @example
- * ```tsx
- * <Profile
- *   visible={isOpen}
- *   onVisibleChange={setIsOpen}
- * />
- * ```
- */
-export declare function Profile({ visible, onVisibleChange, }: ProfileProps): React.ReactElement;
-export default Profile;