"use client";
import { useCheckPermission, } from "./useCheckPermission";
/**
 * Conditionally renders children based on the current user's
 * permission on a resource.
 *
 * Uses {@link useCheckPermission} under the hood. In OSS mode (where
 * the IAM service is unavailable), the gate is always permissive —
 * children are rendered immediately without a network call.
 *
 * This component is designed to hide UI elements (buttons, actions,
 * controls) that the user cannot perform. It does NOT enforce
 * security — the server rejects unauthorized requests regardless of
 * what the client renders.
 *
 * @example
 * ```tsx
 * <PermissionGate resource={{ kind: "agent", id }} relation="can_edit">
 *   <EditButton onClick={handleEdit} />
 * </PermissionGate>
 *
 * <PermissionGate
 *   resource={{ kind: "session", id }}
 *   relation="can_grant_access"
 *   fallback={<Tooltip content="You don't have permission to share" />}
 * >
 *   <ShareButton onClick={openShareDialog} />
 * </PermissionGate>
 * ```
 */
export function PermissionGate({ resource, relation, children, fallback = null, loading = null, }) {
    const { allowed, isLoading } = useCheckPermission(resource, relation);
    if (isLoading)
        return loading;
    if (!allowed)
        return fallback;
    return children;
}
//# sourceMappingURL=PermissionGate.js.map