@zauru-sdk/components 6.9.0 → 6.11.0

package/src/NavBar/NavBar.types.ts

@@ -32,6 +32,7 @@ export type NavBarProps = {
   LinkComponent?: any;
   version?: string;
   reloadCatalogsOption?: boolean;
+  settingsOption?: boolean;
   showDarkModeToggle?: boolean;
 };
 

package/src/Tab/PermissionMatrix.tsx

@@ -174,6 +174,8 @@ function GroupRows({
               >
                 <input
                   type="checkbox"
+                  id={`permission-${role.id}-${action.key}`}
+                  name={`permission-${role.id}-${action.key}`}
                   className={checkboxClass}
                   checked={granted}
                   disabled={disabled || pending}

package/src/Tab/WebappSettingsChrome.tsx

@@ -0,0 +1,54 @@
+import type { ReactNode } from "react";
+import { MainContainer } from "../Containers/MainContainer.js";
+import { SubContainer } from "../Containers/SubContainer.js";
+import { RouteTabNav } from "./RouteTabNav.js";
+
+type Props = {
+  children: ReactNode;
+  showEmployees?: boolean;
+  showRoles?: boolean;
+  showPermissions?: boolean;
+  basePath?: string;
+  title?: string;
+  description?: string;
+};
+
+export const WebappSettingsChrome = ({
+  children,
+  showEmployees = true,
+  showRoles = true,
+  showPermissions = true,
+  basePath = "/configuracion",
+  title = "Configuración",
+  description = "Roles, empleados y permisos de esta aplicación.",
+}: Props) => {
+  const base = basePath.replace(/\/$/, "");
+  return (
+    <MainContainer>
+      <SubContainer title={title} description={description}>
+        <RouteTabNav
+          ariaLabel="Secciones de configuración de accesos"
+          selectedColor="indigo"
+          items={[
+            {
+              to: `${base}/empleados`,
+              label: "Empleados",
+              hide: !showEmployees,
+            },
+            {
+              to: `${base}/roles`,
+              label: "Roles",
+              hide: !showRoles,
+            },
+            {
+              to: `${base}/permisos`,
+              label: "Permisos",
+              hide: !showPermissions,
+            },
+          ]}
+        />
+        {children}
+      </SubContainer>
+    </MainContainer>
+  );
+};

package/src/Tab/index.ts

@@ -1,3 +1,4 @@
 export * from "./Tab.js";
 export * from "./RouteTabNav.js";
 export * from "./PermissionMatrix.js";
+export * from "./WebappSettingsChrome.js";

package/src/index.ts

@@ -1,4 +1,5 @@
 export * from "./Alerts/index.js";
+export * from "./AccessControl/index.js";
 export * from "./BlockUI/index.js";
 export * from "./Buttons/index.js";
 export * from "./Card/index.js";